Comments on: HTML5: Wrap Block-Level Elements with A’s

By: And Finally

And Finally — Wed, 07 Mar 2012 15:59:19 +0000

I love it! There’s absolutely no reason why this should not be legal. It’s a much needed improvement which will simplify code wherever multiple elements need the same link.

By: Luka

Luka — Mon, 26 Dec 2011 14:40:29 +0000

Mixed feelings about what??? 10 years ago or not that long ago people had mixed feelings about DIVs agains TR and TD and xHtml against HTML,;now it’s ridiculous to even mention old approaches…
One link can be clickable, One Div can be clickable, One column (should be clickable)… see no problem :)))

By: Paul Sandel

Paul Sandel — Thu, 01 Dec 2011 17:44:30 +0000

I’m all about it! As most, I’ve been writing javascript for clickable divs. The concern that brought me here, is that I wanted the links to be available to search engines as well as people. I’m so glad HTML 5 allows wrapping most elements in an ‘a’.

Good discussion, btw!

By: Jasper Van Proeyen

Jasper Van Proeyen — Tue, 19 Jul 2011 13:35:33 +0000

As long as it is accessible and it isn’t used as a “trick”, I guess it should be allowed.
I’m very happy that it is allowed now. I often run into the problem where I have a navigation where each “link” consists of a heading, an image and a paragraph.

By: M1ke

M1ke — Mon, 14 Mar 2011 14:48:04 +0000

I disagree, I think this way makes it more clear than the hacks of old. People become used to clicking any part of a “block” of content to see that content in more detail, and previously your only option was to put the content of each block element inside its own anchor (meaning multiple links to the same content; messy) or to use JavaScript which doesn’t show the URL in the status bar, doesn’t apply default “click” styles (which can be forgotten) and isn’t available to everyone. This method is far less open to abuse, and as people are saying it is only taboo because it has been taboo.

By: John Milmine

John Milmine — Fri, 25 Feb 2011 23:51:04 +0000

I don’t think elements should actually be inline/block elements in the first place. HTML is markup not style. Every element should be display agnostic.

I have no problem with the above approach and think it brings clarity betweeen structure (HTML) and style (CSS).

I will definitely use this.

I don’t see how href on every element is a good idea, it breaks down the definition of the element, as now a definition list is also a link???. Just so you can keep block/inline elements?!

By: Ambroggio

Ambroggio — Wed, 01 Dec 2010 11:44:09 +0000

If Firefox wouldn’t have thrown chunkies in the past I’d incorporated that one even before HTML5. This a-tag around block elements cleans up lots of code, makes it more structured and reuseable and additionally adds a lot of usability when done right. I.e. you can click a whole article teaser with photo, headline, intro text to get to the article instead of clicking on some tiny words showing “Read more…”

Normally I solved that by shoving a lot of official inliners in there and styling them as block, like say give a span a div behaviour. which was ridiculous. (but using Javascript would have been worse).

I can understand that it was a heritage flaw… since the a-tag started out as text and inline, the guys at wc3 wanted to keep the declarations clean and sensible, but it’s much better this was.

By: Trevor Saint

Trevor Saint — Mon, 25 Oct 2010 09:52:47 +0000

Yes it feels very dirty.

I was at first very reluctant to even style an element in this way.

However keeping up with the HTML5 trends, I decided yes I would give it a go. Everything was looking great at first.

But then… Random out of the blue the nicely designed element suddenly decided to act very strange Looking further into the issue i noted that Firefox was adding a whole bunch of dodgy code which was messing things up big time for me.

So I had to revert back to the old drawing board. Those without js would get the functionality, but those with js would get the look and feel to accompany it.

The firefox issue is as below:

http://oli-studio.com/bugs/mozilla/block-level-links.html

By: Tim

Tim — Mon, 09 Aug 2010 07:44:33 +0000

Well, I’m so used to make my “HTML Validator” show a green symbol … X-)
On the other hand I don’t care using CSS hacks and js workarounds in my code, so why shouldn’t I wrap blocklevel elements in an inline anchor-tag?

You can use span-tags inside an a-tag and make them block level elements with CSS, instead of using divs or other “not so important” semantic block elements, but I wouldn’t like to replace a headline-tag with that method.

But how about the semantic meaning of an a-tag, it’s not only the validation it self that would give me a bad feeling about that. Think about search engines, screen reader and stuff like that. Using an “A” for a bigger text space just for the link function is not the real sense of HyperText … well thats what I think.

By: Igor Szyporyn

Igor Szyporyn — Sun, 01 Aug 2010 11:41:12 +0000

Is the anchor element now block level?

If that has not changed then its just a supported hack more or less.

Personally I do not like it, and will not be using it – just as easy to make a JS framework function – like a jQuery plugin and control it via classes.

As in every element with the class “is-link” looks for a anchor href inside and applies this to a click event on self.