css - Div 随窗口调整大小而改变位置

Question

我有一个问题，我一整天都在苦苦挣扎。我有两个相邻的 div 对齐。问题是当我调整浏览器窗口的大小（更小）时，右 div 跳到左 div 下方。我为包含父项指定了一个固定宽度，并确保两个内部 div 的宽度不超过父 div 的宽度。我的标记：

<div class="parent">
  <div class="left">contents</div>
  <div class="right">contents</div>
</div>

<style>
 .parent
 {
   width: 800px;
 }

 .left
 {
   float: left;
   width: 305px;
 }

 .right
 {
   display: inline-block; (also tried float: left)
   width: 480px;
 }
</style>

我真的需要帮助，我快疯了。谢谢你

Answer 1

这是您插入 jsFiddle 的代码：

http://jsfiddle.net/FHqtK/

必须有一些其他样式干扰，因为它在这里表现得很好float: left。

Answer 2

尝试这个：

  .right {
        display: inline-block;
        white-space: normal;
        width: 480px;
    }

Answer 3

你确定你的 div 是你指定的宽度吗？它们可能有边距或填充。另外，我希望您发布的代码与您正在使用的代码不完全相同。样式标签应该在头标签内。

你的结构应该是这样的：http: //jsfiddle.net/XEamY/