两个divs一个除了另一个没有包装 [英] Two divs one besides the other without wrapping

问题描述

我正在寻找一个优雅的方式来定位两个div除了另一个没有换行。第一个div是一个图标，第二个是未知大小的文本。

I'm looking an elegant way to position two divs one besides the other without line wrapping. The first div is an icon the second a text of unknown size.

他们不应该在两行中断，但如果没有足够的位置，则隐藏。我尝试使用此示例，但它不工作。

They should not break in two lines but hide if not enough place. I'm trying with this example, but it doesn't work.

有一个类似的问题，但它不一样

There is a similar question, but's it's not the same scenario as size is unknown.

帮助

推荐答案

像这样：

.container {
  white-space: nowrap;
}
.d1,
.d2{
    display: inline-block;
    *display:inline;/*for IE 7 */
    *zoom:1;/*for IE 7 */
    vertical-align:top;
}
.d1 {            
    background-color:#ff0;
}

.d2 {
    background-color:red;
}

检查此http://jsfiddle.net/xcSXA/5/

这篇关于两个divs一个除了另一个没有包装的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！