Background color not applying to section using ios safari

I have a website I’m doing for a client: https://cwicly.romansarts.com.

The first section with the Horse and “Roman’s Arts” logo with two buttons should have a brownish background (#584C3C). It renders correctly on my computer browser, but when I view it on my iphone 14 with chrome and safari, the background does not render, leaving it completely white.

I am unsure what is going on. I searched and found that adding -webkit-appearance:none or even background-color: -webkit-#584C3C should work, but alas, that is not the case.

I am unsure if there is something funky going on with my phone or if this is just a safari quirk I have to deal with. I have no caching plugins active.

Please let me know at your earliest convenience if it renders correctly on your mobile devices.

Thanks!

Wordpress: 6.1.1
Cwicly plugin version: 1.2.9.2.1
Cwicly Theme: 1.0.3 (running child theme)

This might be your issue:

image

It’s not device or OS related, I guess.

1 Like

@Marius

You are absolutely correct. Seems I am more of an idiot than I give myself credit. The SVG did not have translucency applied (alpha channel was 1 not 0) so it showed up white.

The strange thing though is that in Cwicly it rendered transparent. Not sure if this would be considered a Gutenberg/Cwicly bug or not.