html - 在中心的两边放两个div

Question

我想从中心向两侧放置两个 div。

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

对不起链接，由于评分低无法上传图片。

我想要这个:

不是这个(如果我使用“text-align: center”):

Answer 1

您需要为对齐添加一个额外的 div:

<div class="wrap">
    <div class="left">
        <div class="inner">blah</div>
    </div>
    <div class="right">
        <div class="inner">blah blah blah blah blahblahblahblah blah blah</div>
    </div>
</div>

然后在 CSS 中

.wrap {
    display:block;
}
.left, .right {
    display:inline-block;
    width:49.5%;
}
.left {
    text-align:right
}
.right {
    text-align:left
}
.inner {
    background:#ccc;
    padding:20px;
    width:auto;
    display:inline
}

See fiddle