> I'm making good progress (in ie5 anyway) with my first attempt at css. > I'll > deal with FF in a bit. Right now, I'm trying to figure out how to put four > images, with titles, in a 2x2 square layout. You can see my example with > tables here: > > (spaces added to prevent being spidered by the SE's) > > http://www.mocap.com/ default3.asp > > And this is the beginning of my css attempt: > > http://www.mocap.com/ default2.asp > > What I don't understand is how to keep the "news" column from getting > placed > out of order as well as how to stack the four items in the content area. > I'm > just wondering if I would be better off just sticking with tables for the > display of the product images and descriptions? > > On a side note, if you happen to know the trick to getting the layout to > format properly in firefox, I'm not proud, I'll take all the help I can > get > :) > > Thanks, > > Michael
Hey Michael.. I would suggest using div and float to accomplish this. Take a look at this page from a site I coded: http://ladybrowncouture.com/celebs.html Check out the grid image display, it's similar to what you're after.. The relevant code is this: <div class="celebItem"> <img src="images/celebs/tichina_arnold.jpg" width="127" height="163" /><br /> <span class="captionText celebItemText">Designer Deborah Brown and Everybody Hates Chris star, Tichina Arnold</span> </div> I can't say the rest of the site is made to CSS expert standards :-) It was my first pure CSS site... But that part I think I did correctly.. The relevant CSS applied to that is: .celebItem { float: left; width: 25%; text-align: center; background-color: white; } .celebItemText { font-size: 8pt; font-weight: bold; color: #666666; } Make sure at the end of all the floats you put this div: <div style="clear: both;"></div> HTH - Matt
______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d 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/
