JJ wrote:
What is best way to display the image (26px
tall) and then the text (about 12px tall) on the same line, with the
text vertically aligned at the middle of each image?
.listbox li {
clear: both;
padding-top: .5em;
list-style-type: none;
line-height: 56px;
}
.listbox li img {
float: left;
width: 56px;
margin-top: 0px;
margin-right: 0.5em;
height: 56px;
}
because middle alignment varies so greatly between browsers, I approach
it this way, if the images are always the same width and height (as in a
list of thumbnail images with captions). I am sure there are many ways
to do this. I typically put the list in a div that can be positioned as
needed, also.
Here's my markup:
<div>
<ul class="listbox">
<li>
<img src="featured/f0001.jpg" alt="" width="55" height="55" />
a few words
</li>
<li>
<img src="featured/f0001.jpg" alt="" width="55" height="55" />
a few words
</li>
<li>
<img src="featured/f0001.jpg" alt="" width="55" height="55" />
a few words
</li>
</ul>
</div>
HTH
Donna
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
