inherit
163136
0
Nov 13, 2019 15:03:23 GMT -8
feedyourhead
33
February 2011
908127
|
Post by feedyourhead on Oct 28, 2019 5:29:22 GMT -8
How/where do you style [hr] for posts?
I'd like for it to be 1px solid #a6a6a6 instead of the default, if possible.
|
|
inherit
252032
0
Apr 26, 2024 23:51:41 GMT -8
Retread
Tribbial Pursuit.
5,014
January 2018
retread
|
Post by Retread on Oct 28, 2019 5:52:19 GMT -8
If you want all hr element on the forum to appear that way, you could add this to the bottom of your style sheet:
hr {border-top:1px solid #a6a6a6}
If you want only some hr elements in posts to appear that way, you can use inline styling in the BBCode for the ones you want to appear that way:
[hr style='border-top:1px solid #a6a6a6']
|
|
inherit
163136
0
Nov 13, 2019 15:03:23 GMT -8
feedyourhead
33
February 2011
908127
|
Post by feedyourhead on Oct 28, 2019 7:00:46 GMT -8
Thank you for your help!
|
|
inherit
163136
0
Nov 13, 2019 15:03:23 GMT -8
feedyourhead
33
February 2011
908127
|
Post by feedyourhead on Oct 28, 2019 7:38:57 GMT -8
|
|
Kami
Forum Cat
Posts: 40,031
Mini-Profile Theme: Kami's Mini-Profile
#f35f71
156500
0
Offline
Jul 24, 2021 11:48:29 GMT -8
Kami
40,031
July 2010
kamiyakaoru
Kami's Mini-Profile
|
Post by Kami on Oct 28, 2019 8:36:29 GMT -8
Retread had the right idea, but horizontal rules have some default styling that you have to override first. Try: hr { height: 0; margin-top: 1em; margin-bottom: 1em; border: 0; border-top: 1px solid #FF0000; .box-sizing(content-box); } Change #FF0000, 1px, and solid to whatever colour, thickness, and style you want.
|
|
inherit
163136
0
Nov 13, 2019 15:03:23 GMT -8
feedyourhead
33
February 2011
908127
|
Post by feedyourhead on Oct 28, 2019 9:24:35 GMT -8
Retread had the right idea, but horizontal rules have some default styling that you have to override first. Try: hr { height: 0; margin-top: 1em; margin-bottom: 1em; border: 0; border-top: 1px solid #FF0000; .box-sizing(content-box); } Change #FF0000, 1px, and solid to whatever colour, thickness, and style you want. That mostly did the trick, thank you!! The color is still the same, I think, but the thinner line is much nicer.
|
|
Kami
Forum Cat
Posts: 40,031
Mini-Profile Theme: Kami's Mini-Profile
#f35f71
156500
0
Offline
Jul 24, 2021 11:48:29 GMT -8
Kami
40,031
July 2010
kamiyakaoru
Kami's Mini-Profile
|
Post by Kami on Oct 28, 2019 9:40:10 GMT -8
It looks like you're using a6a6a6, which is this. It also looks like you're trying to use inline stying in the post -- just to clarify, you put the above CSS in your stylesheet, correct?
Is there something else you're seeing other than the colour you specified? The "default" horizontal rule displays differently for different browsers, and some of them utilise a grey similar to a6a6a6 which might be why you're not seeing much of a difference.
|
|
inherit
252032
0
Apr 26, 2024 23:51:41 GMT -8
Retread
Tribbial Pursuit.
5,014
January 2018
retread
|
Post by Retread on Oct 28, 2019 11:21:39 GMT -8
Mostly my fault. I should have reset all borders before defining the top border. The inline styling for the BBCode would have looked like this: [hr style="border:0;border-top:1px solid #a6a6a6;"] In the Style Sheet of your default theme you have this at the very bottom: hr{height:0;margin-top:1em;margin-bottom:1em;border:0;border-top:1px solid #2e2e2e;box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;-ms-box-sizing:content-box;}
Redefining the border in the BBCode styling would change the height but not the margins. Also, I'm not sure about the box sizing. Are you viewing your forum using the theme that's set to be the default or are you using a different theme?
|
|
inherit
163136
0
Nov 13, 2019 15:03:23 GMT -8
feedyourhead
33
February 2011
908127
|
Post by feedyourhead on Oct 28, 2019 12:15:04 GMT -8
It looks like you're using a6a6a6, which is this. It also looks like you're trying to use inline stying in the post -- just to clarify, you put the above CSS in your stylesheet, correct? Is there something else you're seeing other than the colour you specified? The "default" horizontal rule displays differently for different browsers, and some of them utilise a grey similar to a6a6a6 which might be why you're not seeing much of a difference. That was my bad, I was looking at the wrong test post and it had the inline styling happening. It seems to have worked just fine! Thanks again!
|
|
inherit
163136
0
Nov 13, 2019 15:03:23 GMT -8
feedyourhead
33
February 2011
908127
|
Post by feedyourhead on Oct 28, 2019 12:18:34 GMT -8
Mostly my fault. I should have reset all borders before defining the top border. The inline styling for the BBCode would have looked like this: [hr style="border:0;border-top:1px solid #a6a6a6;"] In the Style Sheet of your default theme you have this at the very bottom: hr{height:0;margin-top:1em;margin-bottom:1em;border:0;border-top:1px solid #2e2e2e;box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;-ms-box-sizing:content-box;}
Redefining the border in the BBCode styling would change the height but not the margins. Also, I'm not sure about the box sizing. Are you viewing your forum using the theme that's set to be the default or are you using a different theme? Ahhh okay! Yes, I was viewing the default theme and I use google chrome Thank you for your help!
|
|
Kami
Forum Cat
Posts: 40,031
Mini-Profile Theme: Kami's Mini-Profile
#f35f71
156500
0
Offline
Jul 24, 2021 11:48:29 GMT -8
Kami
40,031
July 2010
kamiyakaoru
Kami's Mini-Profile
|
Post by Kami on Oct 28, 2019 12:40:17 GMT -8
It looks like you're using a6a6a6, which is this. It also looks like you're trying to use inline stying in the post -- just to clarify, you put the above CSS in your stylesheet, correct? Is there something else you're seeing other than the colour you specified? The "default" horizontal rule displays differently for different browsers, and some of them utilise a grey similar to a6a6a6 which might be why you're not seeing much of a difference. That was my bad, I was looking at the wrong test post and it had the inline styling happening. It seems to have worked just fine! Thanks again! So what likely happened is because you input the CSS styling and had the inline styling is that it was double border'd (you declared 1px in the CSS, then 1px again in the BB Code, for a total of 2px). That will make the border thicker, and look different from what you intended (especially if you hadn't removed the default styling as well). Just wanted to let you know (:
|
|
inherit
163136
0
Nov 13, 2019 15:03:23 GMT -8
feedyourhead
33
February 2011
908127
|
Post by feedyourhead on Oct 30, 2019 6:15:31 GMT -8
That was my bad, I was looking at the wrong test post and it had the inline styling happening. It seems to have worked just fine! Thanks again! So what likely happened is because you input the CSS styling and had the inline styling is that it was double border'd (you declared 1px in the CSS, then 1px again in the BB Code, for a total of 2px). That will make the border thicker, and look different from what you intended (especially if you hadn't removed the default styling as well). Just wanted to let you know (: That makes total sense. My bad! And thank you for letting me know
|
|