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>®</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
Post a Comment