[thelist] [CSS] Creating table free CSS image blocks

[Sarah Sweeney]

> I've got some generated content that I'd like to style as a block of 
> image thumbs (three in a row), with their respective captions above them.
> 
> I've decided that using a list of thumbs and captions  (which in 
> themselves are a list of items) would be using the correct semantic 
> XHTML to write this up. The php used to generate the lists breaks them 
> at the maximum number of thumbs per row, which currently is 3.

Another (perhaps more semantically correct, but that's open to debate) 
way to mark this up is using a definition list, like this:

<dl class="image">
   <dt>Title 1</dt>
   <dd><a href="/profiles/index.php?profile_id=1" title="Title 1"><img 
src="/photos/thumbs/image1.jpg" alt="Title 1" /></a></dd>

   <dt>Title 2</dt>
   <dd><a href="/profiles/index.php?profile_id=2" title="Title 2"><img 
src="/photos/thumbs/image2.jpg" alt="Title 2" /></a></dd>

   <dt>Title 3</dt>
   <dd><a href="/profiles/index.php?profile_id=3" title="Title 3"><img 
src="/photos/thumbs/image3.jpg" alt="Title 3" /></a></dd>
</dl>

-- 
Sarah Sweeney  ::  Web Developer & Programmer
Portfolio  ::  http://sarah.designshift.com
Blog  ::  http://hardedge.ca