css columns

[jakepeg]

I have a row of 4 images on a page - as so...



<a href="link.html"><img src="/images/home/stock.jpg" class="thumb" /></a>
<a href="link.html"><img src="/images/home/rfcd.jpg" class="thumb"/></a>
<a href="link.html"><img src="/images/home/photo.jpg" class="thumb"/></a>
<a href="link.html"><img src="/images/home/feat.jpg" class="thumb"/></a>

I want to place some text under each image, without using tables?

[DDD]

wrap each in a div then put your p tags under the image for each caption. You will have to use the float method to get them to line up.

Or you can do a list, set it to display inline. Then put your images and p-tags.

Quite a few ways to do it actually. The most flexible is divs and floats. the easiest is lists.

[thats all folks]

I found that this is a similar question that I have, I want to to put images in a horizontal row and was wondering if this is an ok solution that people have used.

ul.seriesImg li{
display:inline;
margin:0;
padding:0 0 0 10px;
list-style:none;
}

<ul class="seriesImg">
<li><img src="test.jpg" width="150" height="150" /></li>
<li><img src="test.jpg" width="150" height="150" /></li>
<li><img src="test.jpg" width="150" height="150" /></li>
</ul>

[zerokilled]

was wondering if this is an ok solution that people have used.

for me the solution is valid. instead of display:inline you can use float:left as well. which ever better suite your needs.