Archived topic
separator css issue
8 replies · Started by Kenneth on September 1, 2021
Love GP- have for years. Using Simple CSS to style Separator hr { background-color: #ff3333; - All of a sudden separators looks like see https://www.daisypetersonsweeney.ca/daisy-peterson-sweeney-resources/ (and throughout the site) I must have done something that is overriding your Simple CSS Plugin? I have looked under Customize. I do not know where else to look. I can provide login details if this helps. Many thanks, Kenneth
Hi Kenneth,
Seems the background color of hr element is still #ff3333.
https://www.screencast.com/t/eaSDzZ18wo
Can you explain more what your issue is if I miss anything?
Let me know :)
Thank you for this Ying. The problem is the hr element is not just a thin line anymore (colour ff3333). The hr separator seems to have an solid upper and lower black line with the orange colour in between. I just want a thin orange line. Hope this helps. Do you need to log in? Bw Kenneth
Ah I see what you mean.
It seems WP added this CSS to the separator block:
https://www.screencast.com/t/S5O4rmIFe
Not sure why they did that, but we can override it with this CSS:
.inside-article hr.wp-block-separator {
border: none;
}
Let me know if this helps :)
Simple CSS now reads
hr {
background-color: #ff3333;}
.inside-article hr.wp-block-separator {
border: none;
}
Problem still exits. :( Would log in details help?
I don't see the CSS has been added to your site, can you make sure cache is cleared?
And these 2 CSS can be combined together as this:
.inside-article hr.wp-block-separator {
border: none;
background-color: #ff3333;
}
Thank you Yong. This seems to have worked. Congrats!
Thank you Ying. This seems to have worked. Congrats!
Glad it works :)