将两个 div 粘贴到另一个 div 上

这就是我想要实现的目标。 我有3个div。我们称它们为左中和右。中心 div 的宽度是动态的。它可以是 100px、200px 等，具体取决于中心 div 所保存的图像。 如何做到无论中心 div 大小如何，左侧和右侧 div 都粘在中心 div 上？

就像是http://jsfiddle.net/t3Gjx/ http://jsfiddle.net/t3Gjx/?

HTML:

<div class="wrapper">
    <div class="left">Left</div>
    <div class="center">
        <img src="http://upload.wikimedia.org/wikipedia/commons/8/80/A-Caracas.png" alt="img" />
    </div>
    <div class="right">Right</div>
</div>

CSS:

.wrapper{
    text-align:center;
    border:2px solid blue;
    font-size:0;
}

.wrapper>div{
    display:inline-block;
    text-align:left;
    vertical-align:top;
    border:2px solid red;
    font-size:16px;
}

Edit:

正如 Zoltan Toth 所说，如果窗口宽度小于元素组合宽度，它们将垂直堆叠而不是彼此相邻。

如果您不想这样，请添加

.wrapper{
    white-space:nowrap;
}

在这里查看：http://jsfiddle.net/t3Gjx/1/ http://jsfiddle.net/t3Gjx/1/