Topic: Is this css legal? (Page 1 of 1)

Heh.. well legal sounds a bit harsh, but...

I have a DIV element which contains other html, headings, paragraphs etc... I want to make it so that when I click anywhere in the DIV it links back to a page in the website.

So basically I changed the surrounding DIV to a link A element. Is this okay to do? I cant see how else you can make a whole area clickable (short of having a link display:block and z-indexing it above the other element).


Are you allowed to have child nodes of the anchor element other than a text node?

<a href="somewhere">
<h1>Some heading</h1>
<p>Some paragraph</p>
<img src="animage.jpg" />
</a>

The problem here is that you have block level level elements inside an inline element, this is generally not allowed.

i actually think that the HTML! is not legal here. you cant put a paragraph, a h1 and an image all into one anchor, can you?

The Space Between Us | My Blog: lukas.grumet.at

well you use it normally around <img /> tags to make an image link, so maybe its okay to to this to any other elements?

I mean it renders correctly, just wondering how else you could do it. Its really the only way without using javascript.

Am I missing something? I don't see any CSS here......

However, if you are unsure if it is valid code, then run it through a validator and find out

quote:

---

H][RO said:

well you use it normally around <img /> tags to make an image link, so maybe its okay to to this to any other elements?

---

IMG is inline.

quote:

---

I mean it renders correctly, just wondering how else you could do it. Its really the only way without using javascript.

---

You can of course do something like

<h1><a href="somewhere">Some heading</a></h1>
<p><a href="somewhere">Some paragraph</a></p>
<div><a href="somewhere"><img src="animage.jpg" /></a></div>

Well, what you are doing is trying to change the behaviour of the the browser to some small extent, thus one way to go about this would be to use JavaScript to catch an onClick event on a surrounding div and run your desired function.

yeh its not really a css issue :P..

Basically all it is is I want the header of website clickable and it takes you back to the home page. It doesnt have to work like that i guess... I think i would rather have valid code.


I don't consider it changing the behaviour of the browser either, just yet another limitation of the design, linking is an embedded part of the browser and shouldnt require javascript.

Then again it works in all browsers anyway so its not so much a html issue as it is a validation spec issue =/