Correct usage of HTML5 <hr> tag

Question

Hi,

I'm writing a new webpage for a company and I have (a sane subset of) HTML5/W3C recommendations in mind.

After reading the semantic meaning of <hr />, I was wondering if this was a good place to use it:

<section name="historyItem">
    <h2>2002</h2>
    <p>Dolorem ipsum dolor sit amet in 2002, consectetur [...]</p>
    <hr />
    <ul>
        <li><a href="#">Link A</a></li>
        <li><a href="#">Link B</a></li>
    </ul>
</section>

My line of reasoning is that, yes, that <hr /> represents a thematic change from section description to section links, but I'm unsure about that.

Maybe "thematic change" means to have a new paragraph later on another subject, and thus my example wouldn't be "correct". What do you think?

(ps.: Yes, that <ul> is CSS-styled to fit a single line and look cool)

Answer 1

I see what you mean. But personally I just wouldn't bother. Ask yourself why you're using the tag in the first place. If you want to delineate a change between the paragraph and the links, then in terms of pure mark-up I don't reckon it's required. If it's about the look and feel of your page (i.e. you want a rule demarcating the two areas), then again I'd question its usefulness, given that you can apply a border to either the paragraph or unordered list tags.

Of course, given that this is html5, you could go the whole hog and use the <section> tag…