乐趣CSS花车

Question

我有以下CSS的一些div，

#wrapper { 
    width:960px; 
    border:1px solid red; 
    overflow:hidden; 
} 

#maintitle { 
    width:600px; 
    height:50px; 
    float:left; 
    border:1px solid #333; 
} 

#sidebar { 
    clear:both; 
    float:left; 
    width:100px; 
    height:200px; 
    border:1px solid #ccc; 
} 

#rightSidebar { 
    width:100px; 
    height:200px; 
    float:right; 
    border:1px solid #CCC; 
} 

我会认为#rightSidebar DIV会浮到#wrapper指定div的最右上角，但是，它的持久低于#maintitle DIV。

#maintitle DIV浮动到左边，它会允许#rightsidebar div浮动到最右上角吗？

它在行动，http://jsfiddle.net/BdpU7/。

Answer 1

这是你的想法？ http://jsfiddle.net/BdpU7/1/

的#rightSidebar需要#sidebar之前走在HTML，然后#sidebar必须具有clear：

#wrapper { 
    width:960px; 
    border:1px solid red; 
    overflow:hidden; 
} 

#maintitle { 
    width:600px; 
    height:50px; 
    float:left; 
    border:1px solid #333; 
} 

#sidebar { 
    clear:left; 
    float:left; 
    width:100px; 
    height:200px; 
    border:1px solid #ccc; 
} 

#rightSidebar { 
    width:100px; 
    height:200px; 
    float:right; 
    border:1px solid green; 
} 

<div id="wrapper"> 
    <div id="maintitle"></div> 
    <div id="rightSidebar"></div> 
    <div id="sidebar"></div> 
</div>