固定Div内的元素混合在浏览器调整大小上

Question

<div id="mainMenu">
   <div id="Title">
       My Website
   </div>
   <div id="Login">
       Login
   </div>
</div>

在CSS中，#mainMenu position:fixed; left:0; right:0; width:100%; #Title float:left; #Login为float:right;

当浏览器窗口最大化时，没有问题，但是当我调整它的大小时，内部元素会混合，当它变得非常小时，正确的元素会在左边元素下面，我怎样才能保持相同的大小父母Div？即使我调整浏览器的大小？

Answer 1

为您的#mainMenu提供最小宽度，以容纳孩子而无需重新定位：

#mainMenu {
    min-width: 600px;
    ....
}

Answer 2

在CSS中，设置：

​#mainMenu{
    position: fixed;
    top:0;
    left:0;
    width:100%;
}
#Title{
    position:absolute;
    left:0;
}
#Login{
    position:absolute;
    right:0;
}

工作小提琴

http://jsfiddle.net/5pt6C/