停止内联块div内容强制其他div不在线。

Question

我有一些水平排列的div，div中的内容正在将其与其他内容排除在外。无论内容多少，我怎样才能让它们排成一行？我打算添加溢出：隐藏如此大的内容不会破坏布局。没有涉及的JavaScript。需要在IE9 +和chrome中工作。

MARKUP

    <div class="panels">1</div>
    <div class="panels">2</div>
    <div class="panels"><img src='\images\img.png' height='64px'></div>
    <div class="panels">4</div>

CSS

.panels {
    /*line-height:200px; */
    display: inline-block;
    width:22%;
    height: 200px;
    margin:5px;
    border: 1px solid blue;
}

我有 fiddle

另一个星期六被工作偷走了。 :(

Answer 1

在vertical-align: top上使用.panels。

http://jsfiddle.net/y9pEV/2/