Welcome to WebmasterWorld Guest from

Forum Moderators: incrediBILL

Message Too Old, No Replies

a link over several paragraphs?

how to integrate several paragraphs <p> into an anchor <a>?



4:20 pm on Jan 7, 2004 (gmt 0)

10+ Year Member


It's my first post here and I hope that the question isn't too dumb... :)

I'd like to do a layout where you have a list of several elements (each one packed in a <div>). Each of these elements has a short description (packed into a few <p>), and when you click on it (on the whole <div>) you have the complete description. Thus this should be the structure for each of my elements:

But as I'm trying to do XHTML 1.1, I'm not allowed to put the anchor above the <p> and <h*>. But I'd like that when you hover the div, the whole div background gets another color (thanks to some CSS and a block display for the anchor), and the whole div should be clickable, thus I need to put the <a> at the top level...

Is there a way to do what I'd like and still validate XHTML 1.1?




4:33 pm on Jan 7, 2004 (gmt 0)

10+ Year Member

some ideas of work-around:


<span class="h1">element</span>
<span class="p">description1</span>
<span class="p">description2</span>

In this example I have to do all the formatting of the h1 and p in the CSS... Not very elegant, if they already exist in the html, they should also be used. But well, if there's no other possibility! ;)



Here I need to put three times the same link. And in this case the background color on hover will only change for each local element (each p and h1), not for the whole div as I'd like. This could be corrected with a hover rule for the div too... But not very nice solution too.


That's all for my current inspiration. :)



9:32 pm on Jan 12, 2004 (gmt 0)

WebmasterWorld Senior Member g1smd is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

No, the initial ideas cannot be done like you suggest. You are breaking many of the fundamental rules of HTML document structure. Headings and paragraphs are block-level elements.

The latter suggestions would work, but are far from ideal in many ways.


1:04 am on Jan 13, 2004 (gmt 0)

10+ Year Member

ok, so how would you solve this problem?

i have one more question, is there some condensed documentation that clearly explains the html elements hierarchy, such as what is block-level and so on? of course it's accessible in w3c's html specification, but because there is so much information, it's not very clear if you just want to see and understand that.

and thank you very much for your answer!



3:32 am on Jan 13, 2004 (gmt 0)

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member

Here's the W3C's basic overview page. It was written for HTML 4, but you can easily extrapolate to XHTML.

The global structure of an HTML document [w3.org]


Featured Threads

Hot Threads This Week

Hot Threads This Month