Question

trying to use blueprint css framework, but can’t understand why this is happening.
I have the html:

<div class="span-18">
    <div class="span-6"></div>
    <div class="span-12 last"></div>
</div>

and CSS:

 .span-18 {
    width: 710px;
    margin: 0 auto;
    border:1px solid red;
    height:300px;
 }
 .span-6 {
    float:left;
    width: 230px;
    margin-right:10px;
    border:1px solid blue;
    height:100px;
 }
 .span-12 {
    float:left;
    width: 470px;
    margin-right:10px;
    border:1px solid green;
    height:100px;
 }
 .last{
     margin-rigth:0px;
 }

but the inner two divs are not inline. you can take a look at http://jsfiddle.net/GVMFU/3/
thanks for any help.

update:: width 710=230+10+470 they should be inline?

Answer 1

1 pixel borders, 230 + 10 + 470 + 1 + 1 + 1 + 1 = 714

And you’ve typoed in your .last class, should be margin-right:.