homepage Welcome to WebmasterWorld Guest from 54.196.189.229
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Subscribe to WebmasterWorld
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

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




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

Hello,

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:
<div><a><h1>element</h1><p>description</p><p>description</p></a></div>

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?

Thanks,

Gabriel

 

gabriel




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

some ideas of work-around:

--

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

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! ;)

--

<div>
<h1><a>element</a></h1>
<p><a>description1</a></p>
<p><a>description2</a></p>
</div>

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. :)

Gabriel

g1smd




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

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.

gabriel




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

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!

gabriel

tedster




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

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]

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved