css - 3 Column Fluid Div Display Glitch: "Hanging" Individual Divs -


i have responsive fluid design portfolio 3 columns. wrong css having trouble pinpointing.

if have 3 items on row, appears fine. however, if last item ends on line 1 or 2 columns, whole format gets distorted. can seen resizing browser.

if can me pinpoint css fix this, appreciate greatly.

the example page here: http://bit.ly/kzfn2g

i believe main css style culprit of problem, wrong:

 .mosaic-block-three {     margin-right:3%;     width:29.3%;     background:url("../img/progress.gif") no-repeat scroll center center #f5f5f5;     border:1px solid #ffffff;     box-shadow:0 0 4px 0 #888888;     float:left;     margin:10px 40px 30px 0;     overflow:hidden;     position:relative;     width:291px; } 

whoa, holy registered trademark batman! put

<sup>&reg;</sup>  

if :) question @ hand...

why have many lists 1 item? you've got styles in there aren't defined, think biggest problem have items within

<li> 

that floated while containing elements not.

try floating .portfolio-three-item clearing contents within it. having floated elements inside non-floated elements (without using clearing class or

<br clear="all" />  

confuses browser , doesn't though of contents need floated.


Comments

Popular posts from this blog

java - Play! framework 2.0: How to display multiple image? -

gmail - Is there any documentation for read-only access to the Google Contacts API? -

php - Controller/JToolBar not working in Joomla 2.5 -