Archived topic
inline CSS being overwritten
6 replies · Started by William on May 8, 2022
Hi, I am having a problem with Inline CSS getting overwritten (I thought it always had priority).
Some of my post titles display over two lines in the sidebar, so I am trying to add a circle in front of each title.
Using Firefox Web Developer Tools, I navigated to that element on the page.
When I add the two CSS lines below to the element in Web Developer Tools, it works just they way I want.
margin-left: 0;
list-style: circle;
This is what I want; which is also what I get entering the CSS into Web Developer Tools
https://w-f-m.com/wp-content/uploads/2022/05/Screen-Shot-2022-05-08-at-18.07.56.png
Below is the code which appears under Changes in Web Developer Tools, which I pasted into Additional CSS for the theme.
.wp-block-latest-posts__list {
margin-left: 0;
list-style: circle;
}
Unfortunately, as you can see from this screenshot the "list-style: circle;" gets overwritten and so is ignored.
https://w-f-m.com/wp-content/uploads/2022/05/Screen-Shot-2022-05-08-at-18.10.56.png
Can you tell me please how to get the "list-style: circle;" to work?
Kind regards,
William
Hi there,
Any chance you can link us to the page in question?
You can use the private information field:
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information
Let me know :)
Hi Leo, Many thanks for such a quick response. Here is an example page of the inline CSS getting overwritten.
https://w-f-m.com/wisdom-and-forgiveness/
Kind regards,
William
Hi there,
you can try this:
.wp-block-latest-posts.wp-block-latest-posts__list {
margin-left: 0;
list-style: circle;
}or specifically for styling the list in the sidebar:
.sidebar .wp-block-latest-posts__list {
margin-left: 0;
list-style: circle;
}Hi William
Thats how css works. The last rule applied wins. Inlined styled has preference if set in an html element as attribute.
!importance and specifity supersedes the order in what rules are applied.
Specifity: Doing what David tell you.
David: I so appreciate the support on here. :-)
Its clear, to the point, and even adds some options.
Longinos: "!importance and specifity supersedes the order in what rules are applied." I had not understood that till now. Thank you too. :-)
Glad we could be of help!
