[Resolved] ONe of my Views is not respecting the CSS in the style box
This support ticket is created 6 years, 8 months ago. There's a good chance that you are reading advice that it now obsolete.
This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.
Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.
No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.
I am trying to: Style a DIV in my view by placing CSS in the style box
Link to a page where the issue can be seen: I can provide this privately
I expected to see: I expected my DIV's background to be styled a color
Instead, I got: The background does not style according to the color in my CSS
I have noticed a lot lately that I have needed to add "important" to styles in the CSS box in Views or Content Templates. I haven't had time to look into why that might be, but now i have run into an issue where the styles in the CSS box are not being respected at all, even with !important. I am not sure why it might be. I think I have checked all the obvious things (I hope) like whether my DIV name is wrong, or my code is wrong, or if there are overriding styles in my style.css, but this doesn't seem to be the case.
I will provide a link and site access privately. The View in question is called "Home Page News Item" and the DIV is #newsImage.
To debug such CSS issues you should use your browser's dev tools to inspect the element in question and look at what styles are being applied to it, firstly whether the custom style you have added is being applied, and then whether it is being overwritten by some other style, whose source you should be able to determine using the dev tools.
I can help with that, but will need to know what page I'm looking at and which element on the page you are styling, and how.
If I get site credentials from you I can look at the View where you have inserted the custom CSS and check that CSS. Note that if you have any extra .htaccess security to protect your login page I will need that too.
The password you provided didn't work, but I was able to do some digging on the front-end.
I can see that the style rules you added are present in the header, but for some reason they are not being applied to the matching element.
It is not as if they are being applied but are being over-ruled by some other style rules, they are simply not being applied at all.
I think I might need to install a copy of the site locally so I can test it more easily.
Could you provide a duplicate? I see you are using WP Engine and so I recommend you add the All in One WP Migration plugin, create a backup (you can exclude post revisions and the media library to make the archive smaller), download that to your computer, and then upload it to a service such as dropbox that you can share with me.
I'll mark your reply as private again so that you can update the password details and link to your backup archive.
Sorry for the delay getting back to you. I'm still working on this, you may see me making minor changes in the staging site.
I've asked colleagues for another pair of eyes on this in case I have missed something obvious. The custom CSS is right there in the page head, but the targeted DIV isn't picking up the style rules.
One of my colleagues spotted it, it is easy to miss.
The problem is not with that View, but in the View "Bulletins". In the custom CSS section of that View you have a stray curly brace at the end, which prevented the subsequent style rules from your Home Page News Item view from taking effect.
I knew that it had been functioning previously without issue, so I couldn't figure out why suddenly it wasn't working. I really appreciate you taking the time to figure out the problem.
And I learned something new I think. So after a stray curly brace, are all other CSS rules (except for inline rules) ignored?
And one final question, are the CSS rules in Toolset loaded before or after my style.css sheet. Afterwards, yes? Hence no typical need to put !important.
I suppose the curly brace issue was apparent to me in a regular stylesheet or independent box, but I had not mentally put together how the css from separate Toolset boxes was pulled together in the final page. ?
