彼此相邻的两个div - 将左侧扩展为全宽

Question

我有两个div,右边一个必须向右浮动,宽度为100px.现在我希望左边的一个扩展占据所有空间,直到正确的开始.

有人可以帮忙吗？

我在这里有一个jsfiddle:http://jsfiddle.net/brfbugnL/

HTML:

<div class="wrap">
    <div class="left">
        Hi hi
    </div>
    <div class="right">
        right
    </div>
</div>

CSS:

.wrap {
    width:100%;    
}

.left {
    display:inline-block;
    border: 2px solid;
    margin-right:110px; 
}

 .right {
     width:100px;
     float:right;
     border: 2px solid red;
}

Answer 1

你可以使用display:table-cell并display:table得到你想要的东西:

.wrap {
    width:100%;
    display:table;
}
.left {
    display:table-cell;
    border: 2px solid;
}
.right {
    display:table-cell;
    width:100px;
    border: 2px solid red;
}

<div class="wrap">
    <div class="left">Hi hi</div>
    <div class="right">right</div>
</div>