html - 100% width in three-column layers? -
having html:
<div class="images_portfolio panel-widget-style"> <a href="imagelink"><img src="x.jpg" alt="" /></a> <a href="imagelink"><img src="x.jpg" alt="" /></a> <a href="imagelink"><img src="x.jpg" alt="" /></a> <a href="imagelink"><img src="x.jpg" alt="" /></a> <a href="imagelink"><img src="x.jpg" alt="" /></a> <a href="imagelink"><img src="x.jpg" alt="" /></a> <a href="imagelink"><img src="x.jpg" alt="" /></a> <a href="imagelink"><img src="x.jpg" alt="" /></a> <a href="imagelink"><img src="x.jpg" alt="" /></a> <a href="imagelink"><img src="x.jpg" alt="" /></a> <a href="imagelink"><img src="x.jpg" alt="" /></a> <a href="imagelink"><img src="x.jpg" alt="" /></a> </div>
and css:
.images_portfolio.panel-widget-style img { width:100%; height:auto; } .images_portfolio.panel-widget-style { position:relative; display:block;width:32%;margin-right:1%; float:left; margin-bottom:1%; }
it
i can 32%+32%+32% = 96% + margin right (1%*3) = 99% in total of parent element.
how can 100% of parent element works in major browsers? number of links can vary never know if it's 5 or 18 etc... (i want the images aligned element down below 100%. hope understand mean).
try using width: 33,33333333%
, instead of margin-right
use padding-right
. padding offset inside element counts towards elements width.
Comments
Post a Comment