Staged website font colour not working

Community resources Webflow Tips
1

Hi All,

So I have published my Webflow project on the staged domain to view it on my iPhone. Everything seems to be working except the top of my home page. The font is meant to be white but it is displaying black. To make things even stranger, the button used at the top of the page (with the incorrect black font) is the same class used in the other buttons further down on the page, which are displaying the font in the correct white color.

Everything works as expected apart from when viewing the website from the staged link on my iPhone.

Have I done something wrong, I feel like I’m going crazy lol

Read only link

Staged link

Here is the designer:

designer
designer856×1428 69.5 KB

Here is the staged website on my iPhone:

staged iphone
staged iphone1125×2436 125 KB

Notice how the font is white in the designer but is black in the staged website

thanks,
Gav

2

Hey Gavin!

Try explicitly setting the font color on the main-button class itself. Currently the font color is inherited from parent elements like the hero-element or the body itself.
If you compare the buttons, you will see the color is different for those!

3

Hi RDaneelOliwav,

I give your suggestion a go, but unfortunately, it didn’t work. I don’t understand why this is happening. Do you have any other suggestions?

Thanks,
Gav

4

What device / browser are you using? Does it affect all browser / devices you use?

5

On Chrome and Safari on my iPhone only. I have discovered that the black font is being inherited from the body. So if I change the font color on the body then it renders as expected. But doing that isn’t very useful as I would have to change all the other font colors. I don’t know if this is a bug or I have messed up with someting