css - Div spacing problem -


i trying space out divs. have 5 divs 30px wide , want put these div 150px wide. sounds simple find 5 divs don't fit.

5*30 = 150 (but requires 166px outer div them fit inline)

i have fiddle

<div class="a">     <div class="b" >a</div>     <div class="b" >b</div>     <div class="b" >c</div>     <div class="b" >d</div>             <div class="b" >e</div>     <div class="b" >f</div> </div>  div.a { background-color: red; width: 150px;} div.b { display: inline-block; height: 20px; width: 30px;} 

is there missing? can't understand why browsers space way do.

as turning divs inline elements, other inline content come play, i.e. white space between elements. space between each div, takes few pixels more.

if remove white space between divs, there no spaces between them, , 5 elements fit in 150 pixels:

http://jsfiddle.net/slq6z/1/


Comments

Popular posts from this blog

sql - text truncated using perl DBI insert -

c++ - Is it possible to compile a VST on linux? -

php - Pass object by reference or value -