<dl>
<dt>Product title</dt>
<dd>Product description - this can be as long as you like</dd>
<dd><img src="" alt="product title"></dd>
</dl>
<style>
dl { position: relative; }
dl dt { margin-left: 110px; font-weight: bold; }
dl dd { margin-left: 110px; }
dl dd img { position: absolute; top: 0; left: 0; width: 100px; height: 100px; }
</style>
As others have said, I like this better than putting the image in the dt. This works in Firefox (Linux and Windows) and Konqueror, but breaks in IE 6 (it seems to be ignoring the absolute positioning of the image). Perhaps someone could expand on this to make it work in IE?
Daniel Nitsche
On 4/4/06, Thierry Koblentz <[EMAIL PROTECTED]> wrote:
Richard Czeiger wrote:
> Hi Thierry,
>
> I guess the tricky bit is what goes in the "blahblahblah".
> I'd love to be able to get rid of the classname but I think the <dt>
> that holds the image would have to be positioned somehow and I'm
> pretty sure you can't work backwards up the cascade (more's the pity).
No matter what the "blahblah" is, there is no need for using a class.
td img {} would get to the image as .img {} does.
> So what would you suggest?
I'd put the image in the DT and float it (the DT), giving it the width of
the wider image that could be used in there.
Then I'd use auto margin on the image so they would appear centered in
relaltion to each others.
Would that work for you?
Regards,
Thierry | www.TJKDesign.com
******************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
