I'm guessing this is an easy fix but I can't seem to come up with a CSS class that will work for me. See this page (example link removed). Ignoring the styling problems with the border, all I want to do here is have the ability to display the boxes next to eachother and have them retain centered alignment whether I have 2, 3, 4, etc. Obviously at this point my divs are stacking the boxes vertically and this horizontal thing is escaping me Thanks in advance to any and all potential helpers! My CSS /* Image Captions */ .imagebox { width: 150px; align: right; margin: 1.25em auto 0; } .caption { font-size: .8em; padding: 0 .6em 0 0; border: solid black; border-width: 0 1px 1px; } Code (markup): My HTML (3 duplicate boxes in this case) <div class="imagebox"> <a href="http://www.domain.com/image.gif"><img src="http://www.domain.com/image2.gif" /></a> <div class="caption"> <p>Caption text.</p> </div> </div> <div class="imagebox"> <a href="http://www.domain.com/image.gif"><img src="http://www.domain.com/image2.gif" /></a> <div class="caption"> <p>Caption text.</p> </div> </div> <div class="imagebox"> <a href="http://www.domain.com/image.gif"><img src="http://www.domain.com/image2.gif" /></a> <div class="caption"> <p>Caption text.</p> </div> </div> Code (markup):
I'd put the three 'imagebox' div's inside another div with a set width of 450px (the three boxes put together). Apply { float: left; } to the 'imagebox' divs too Apply the { margin 0px auto; } to the new box as well to center the new box. There may be better solutions but that works
@ Anthony That was perfect - my earlier attempts at an extra failed div miserably but this did the trick exactly - thanks! Just a note to others who may read this: I added a 5px padding in the new div to keep the image boxes seperate and clean
Glad I could help, if other bugs occur because of the floated div's - you might want to look up using a 'clear' div .stylename { clear:both; } this would be placed on an element that would go underneith the three floated divs, inside the containing div. but otherwise don't wrorry