6 replies [Last post]
deronsizemore
deronsizemore's picture
Offline
Enthusiast
Last seen: 10 years 38 weeks ago
Timezone: GMT-5
Joined: 2007-01-18
Posts: 113
Points: 14

http://www.randomjabber.com

I'm trying to throw in a seemingly simple hr tag at the bottom of each article summary on the homepage. Something that is so simple is turning out to be not so simply. HR tags by default are suppose to be centered, are they not? Mine isn't. I can only assume that mine isn't because of the text-align: left attribute in which I've given #wrapper when centering the layout. However, I can't seem to figure out how to override this text-align: center attribute for the hr tag so that it's centered and not left aligned.

Thoughts?

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 46 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

No they are not meant to be

No they are not meant to be centered by default afaik, as are many/most elements not centered by default. Margin auto should center the hr's, I would check though how things are displaying across a few browsers as styling hr elements can be tricky.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 6 years 39 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

hr { display:

hr { display: block; margin: 0 auto; }

edit// beat again Sad

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 46 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Fair dues though I didn't

Fair dues though I didn't mention 'blocking' the HR; FF doesn't need it or perhaps it does? but I usually do so as it has interesting and beneficial effects when I have occasion to use HR

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

deronsizemore
deronsizemore's picture
Offline
Enthusiast
Last seen: 10 years 38 weeks ago
Timezone: GMT-5
Joined: 2007-01-18
Posts: 113
Points: 14

Hmm, I guess I was

Hmm, I guess I was misinformed. Of the articles I read on google about horizontal rules and how to style them, they all said hr's are centered by default.

At any rate, I wasn't away of hr's problems across browsers (this is actually my first time ever using them).

I'll give it a shot and see how it looks across different browsers. If I can't get it cooperate, I may just use an image or something.

Thanks for the help. Smile

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 46 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Well it looks as though you

Well it looks as though you are right they are centre aligned, my bad Shock

And your supposition about the text-alignment must be correct, they do act as display: inline but I admit that I hadn't realised that they would auto align especially as text align left is defult for text, yet clearly needs to be stated to have effect.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

deronsizemore
deronsizemore's picture
Offline
Enthusiast
Last seen: 10 years 38 weeks ago
Timezone: GMT-5
Joined: 2007-01-18
Posts: 113
Points: 14

Hey, no problem. It seemed

Hey, no problem. It seemed weird to me as well.

I appreciate the help from you and wolfcry. It's working now. Smile