Foundation-sites: <hr> is unnecessary

Created on 10 May 2013  路  18Comments  路  Source: foundation/foundation-sites

Nobody uses <hr> seriously anymore except Foundation. It is semantically redundant and just muddies up the markup. Bootstrap uses section borders. Rendered markdown uses header borders. Foundation takes the lazy approach and just sticks <hr> all over the place.

Most helpful comment

[Edit] Original title of issue was <hr> is stupid and unnecessary [/edit]

Posting an issue like that is even more stupid and totally unnecessary.
I use hr all the time. What's wrong with it?
Why not use Bootstrap? instead of posting rubbish complaints.

If you have a real issue, common courtesy goes a long way, doesn't it?
Elitist you are.

All 18 comments

[Edit] Original title of issue was <hr> is stupid and unnecessary [/edit]

Posting an issue like that is even more stupid and totally unnecessary.
I use hr all the time. What's wrong with it?
Why not use Bootstrap? instead of posting rubbish complaints.

If you have a real issue, common courtesy goes a long way, doesn't it?
Elitist you are.

If you really want to know:

In HTML5, the <hr> tag defines a thematic break.

In HTML 4.01, the <hr> tag represents a horizontal rule.

However, the <hr> tag may still be displayed as a horizontal rule in visual browsers, but is now defined in semantic terms, rather than presentational terms.

So, in HTML5, a horizontal rule is thematic/semantic.

Not just being a prick, trying to start a discussion. Foundation claims to be a framework for 'the future' and use of hr is a thing of the past.

It breaks the separation of content and presentation. It's purpose is to draw a line across the page, which can and should be done with CSS.

The W3C retroactive redefinition of the tag doesn't change the fact that it is redundant. There are tags such as p and section to define breaks in the content. Arguing for the 'thematic break' definition doesn't help either because Foundation isn't using it that way. It's used to draw underlines under headings.

@brycec

I believe it would be helpful if you actually explained what you would like to see changed instead of simply complaining that a standard HTML tag "is stupid and unnecessary".

@brycec You could have a point, but I don't really care because you are really being a rude dude.

It is not a very effective way of starting a discussion: hey, guys: you are all stupid idiots who does unnecessary stuff.

I generally view the Zurbians as forerunners, so perhaps they've got an explanation?

Even if they are wrong, starting off with an insult is not the right way.
I mean: you are posting an issue in their issue tracker..

If you could point me to where I can learn that hr is a tag of the past, I'd be grateful.
My google-foo is not up to snuff atm.

I know about Chris Coyier - but I'd like to read other resources as well. He can be an opinionated guy. :)

@kurtismullins You're right, sorry, I'll be more explicit.

What I would like to see is removal of all <hr> related code, being replaced by a more conventional and semantic approach, such as border-bottoms on sections or headings.

@jacmoe I didn't think I was insulting anyone by expressing my opinion on a tag invented a long time ago. Zurb had nothing to do with the inception of hr so I don't see why they would be insulted. Obviously, there is no one true way for something like this and it's entirely up to debate, so nothing should be taken personally anyways.

The <hr> tag is stupid and unnecessary. Zurb is using it all over the place.
The conclusion comes naturally, don't you think? :)
Let's see what their reply is gonna be. I am curious.

I think Hummers are stupid but I don't think people who own or drive them are inherently stupid. That's called jumping to conclusions. I have no idea how a person came to be a Hummer owner and I don't judge them for it.

Yes, but you don't knock on your Hummer driving neighbors door and tell him that you think driving a Hummer is stupid and unnecessary, would you?
Semantically, you didn't say that he was stupid, but thematically...

I am not really concerned about how they write their HTML, because it is their css/scss and their js I am after. :)

I'm not knocking on Zurb's door either. They are deliberately soliciting feedback by having a public github repo, including negative feedback.

Also interesting that you bring up the fact that you are only after the CSS, which would leave me to believe that you would be in favor of horizontal lines being a part of the styles. As it is, there's no way to produce a line without the use of hr which I think is a huge drawback of the framework.

What is it with you Ruby web devs?

From somewhere in the generated css:

hr {
  border: solid #dddddd;
  border-width: 1px 0 0;
  clear: both;
  margin: 1.25em 0 1.1875em;
  height: 0;
}

I can't find hr anywhere else in the style sheet..
Are you referring to their template examples?
Or something else?

Or are you requesting some css in the Foundation style sheets to produce a line?

What does Ruby have to do with it? And yes to all those things.

The examples should show the correct use of the framework and that seems to be use hr to make a line. That is a stylistic choice that should be left to the CSS. If I separate my sections with hr then decide later that I don't want a line at all, it would require me to do display: none; and have pointless hrs everywhere. Or I would go through and remove all the hr tags. That's circumventing the whole point of CSS.

I can agree in principle: that the hr tag is too presentational, and that the use of it should be avoided if your goal is to write semantically.

Can't you use the scss and generate the style sheets you want?
Or perhaps introduce a Foundation setting which turns off the styling of the hr tag?

That is, if you don't want to override the hr in your own style sheet / scss code ?

[edit]
About Ruby?
Well, I feel that where most other groups of developers tend to be pragmatic about things, Ruby developers (RoR devs in particular) tend to be very fanatical about agile web dev and the one true way
I can smell a Ruby web developer from miles away.
Don't take it too personal. I am jesting :)

Of course I can just set it up myself or make a setting but that's extra configuration and the value in using a framework is minimizing configuration in favor of conventions.

Maybe I'll just go ahead and make a pull request.

So let me get this straight... Your opinion is that if I'm writing a blog post that has a break in content that I would like to show visibly, I shouldn't use a <hr> tag, instead all my <section> have border-bottom: # and I should now wrap my content in multiple <section> tags? That's ridiculous.

I am noboby or so it seems. :)
I do use the hr tag if I want to insert a horizontal ruler, like @ascottmccauley says.
Like a break in a blog post, or to separate the footer from the content.
I am not really using it for other things, like a thematic, invisible break in content.
And I am also not using it for borders. I know that some people actually does this..

You know what?
I actually use the <br/> tag as well on occasion. ;p

I don't use section and article tags, on principle.

We definitely appreciate the discussion here! The thing is, the <hr> is only really used in the docs and pages the break up content. So it is being used properly in that context. There is nowhere in the core of the framework that we force you to use the <hr> element. I'm going to close this down as an issue since it really doesn't effect the core of the framework.

The main reason we use them is to break up chunks of content on the page when we're needing to quickly update the docs, etc. We find them quicker to use in this context for our purposes.

Was this page helpful?
0 / 5 - 0 ratings