CSS 布局 : no line break between divs, 即使浏览器窗口太小

Question

我知道这不是什么新话题，但我所有的研究都没有结果。

我试图实现的目标:

1. 一个 div 内有两个彼此相邻的 div。 (简单: float 、内联 block )

2. 如果浏览器窗口太小，div 应该彼此相邻。

现在发生了什么: 如果浏览器窗口不够宽，第二个 div 会滑到第一个 div 下方。

示例:http://pastebin.com/e9cuWjwT

我该如何解决这个问题？

Answer 1

如果您为 div 周围的容器添加宽度，即使屏幕空间变小，它们也会彼此相邻。因为您已经告诉浏览器您想要容器有多大，所以调整屏幕大小不会影响它们的位置。

这是一个带有非常简化的代码的 fiddle ，用于显示有效的场景:

http://jsfiddle.net/Lera/CmJhw/1/

CSS:

.wrapper {
   width:1024px;
}
div {
   display: inline-block;
}

HTML:

<div class="wrapper">
    <div>First Div</div>
    <div>Second Div</div>
</div>