its been years since i wrote my last hr, i was wondering if anyone was still using it vs using borders or background images in their paragraphs or divs....
To my knowledge it is just used to divide a paragraph, but wouldn't you just use another paragraph?
Are there more any other uses for an HR?
- using an empty paragraph to separate other paragraphs wouldn't be hugely semantic...
- I'm not saying empty paragraphs. if you have content in one paragraph, and you want to divide it by an hr, i think it would be more semantic to just divide it into 2 paragraphs, and ignore the hr. for example: <p> content1 <hr /> content2 </p> changes to: <p> content1 </p> <p class="style1" > content2 </p>
- i've just found out why i was always weary of using HR in the first place... ie adds extra space to the top and bottom of the hr... even after resetting the css...
4 answers
points
It seems split between people who use them regularly still, and others who have never found a use. In my mind they are semantically redundant. I can already divide content semantically with p, div, section, article, etc. I don't gain any additional semantic meaning from hr, and markup is meant to be about semantics, so why bother? There's always a way to get the style you want, one way or another, whatever the HTML is.
UPDATE: <hr> has been given semantic meaning in HTML5 now. And I will start to use it accordingly. Article over at HTML5 Doctor.
- Eric Meyer? Only 70 experience points??? lol...
- Now you have 75 -- great answer :)
- Everyone has to start from zero. That being the case, I think you may have me confused with a more prominent holder of my name.
point
HR tags can be used to separate content in an HTML page. Aside from that you can also style the HR tag and give it various attributes. Things that you wouldn't necessarily be able to do with borders or background images.
You can find more info on HR tags here
- i don't think there's something an hr can do, that a styled paragraph with a background can't. Thanks for the info thought.
- @Jordan: Actually you need to sort of hack the <hr> tag to show a background image across all browsers (ref: http://www.sovavsiti.cz/css/hr.html). @prozaker: I could say the same thing about using a div over a styled paragraph.
- but a div wouldn't be semantically correct....
point
As @Jordan stated, an HR is used to separate content. In my view it's kind of like an inside-out DIV. DIVs contain separate chunks (divisions) of content and HRs are used to separate/divide content.
As a side note, Borgar Þorsteinsson wrote up a really cool technique for graphical HRs http://borgar.net/s/2007/01/style-hr-elements/
points
I do not usually use <hr> unless it is temporary code. For instance, in my WIP blog I use <hr> because I haven't got around to implementing all the different style renderings of separate blog entries.
