Posted: September 11, 2021 at 9:28 am
I can’t get the styling to work on my site. The table rows and legend description text color are sometimes white on white. Sometimes it starts out black then changes to white once the page is fully loaded. I can see, looking at the CSS via “inspect element ” that the css is being inherited from
But I cannot figure out how to change the CSS no matter what I do.
Can you help?
Seems Divi is set to load a dark layout, but then your site is loading white. There are more sections than just Event Espresso being affected by this.
The above selector isn’t the correct one for this issue, it’s:
To fix the issues specifically with EE My Events section you can use something like this:
You can add that in Divi’s custom CSS section.
However, I’m not sure why Divi is set load as a dark theme/layout and then text is being manually fixed when this happens, seems you don’t actually need a dark layout?
That zoomed past my CSS knowledge. I can add the this to the Custom CSS pages but I am curious.. I know you are NOT tech support for Divi, but how did you determine that Divi was loading a dark layout? For sure, not my intent and I’ll want to change that globally and any knowledge my may have could help.
For dark mode:
I don’t use Divi but I saw the body class
Googled the above
For the CSS solution, I used Chrome Dev Tools to see what styles were being applied to the elements I knew were missing. This comes from experience but isn’t complicated, it just takes a little trial and error.
So right-clicking on a section I knew should have a legend item and did inspect element, that opens up Chrome dev tools on that section. This is where a little experience is needed, you navigate through the elements to find one (I used the Approved legend) and take a look at the styles being applied.
I can see you have a white background so I’m looking for anything explicitly setting the colour to white, then I found this:
Disabling that (hover over the ‘color’ and a checkbox will appear) started to fix the text, so from there I knew what I needed to override.
See here for details on CSS specificity:
Then I come up with the above by basically copying the selector I found earlier and making it more specific, using
Does that help?
The support post ‘ESPRESSO_MY_EVENTS. Styling Problems’ is closed to new replies.
Have a question about this support post? Create a new support post in our support forums and include a link to this existing support post so we can help you.