At 1/24/2007 01:31 PM, Garth Jantzen wrote:
>I'm looking for a way to create a 'teaser box' you might call it, which
>would contain an image say, 80 x 80 floated to the left with a description
>floated to the right, both of which are wrapped in a box. The box is a link
>to my portfolio page. I want the background color to change on a mouseover.
>I currently have it set up as a definition list with a heading as dt image
>as dd, and the description as a dd. But because I want the whole box to be a
>link, is it semantic to wrap each 'teaser box' in an anchor tag? I want to
>use the <a> as a block element so IE users can see the hover. I would rather
The first answer is No -- you can't wrap a DT/DD pair in an
anchor. Try it and validate it to see. You can also consult the
HTML 4.01 Specification
10.3 Definition lists: the DL, DT, and DD elements
My guess is that what you're looking at is an unordered list in which
the LI is the container for your item data structure. If you want to
enclose everything inside the list item in an anchor you can only use
inline elements such as spans and images:
12.2 The A element
<img src="xxx" alt="xxx" />
Then use CSS to format these elements to your heart's content.
Personally I don't quite understand why it's kosher to style an
inline element as a block when it's in a markup context that only
allows inline elements, but those more knowledgeable than myself have
said it's OK.
Juniper Webcraft Ltd.
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/