javascript - css3盒子模型浮动元素

Question

我是网页设计的新手，我认为我对盒子布局的理解问题。

HTML

<div class="content">
  <p class="inner left">....foofoofoo..</p>
  <p class="inner right">....blablabla..</p>
</div>

css

.content{
   display:-webkit-box;
}

现在我的问题是我必须将内部元素一个向左对齐，另一个向右对齐。

我知道如何以旧方式做到这一点，但我想用 box 属性来做到这一点。

老办法。

.content{
  display:block;
}
.left{
   float:left;
}

.right{
  float:right;
}

score 0 · Accepted Answer

0

使用 box-pack 属性来证明您的内容。

box-pack:justify;

于 2012-09-18T12:05:49.837 回答

score 0 · Accepted Answer

这是一个非常有效的替代方案：

.content{
    display: -webkit-box;
}

.inner {
    -webkit-box-flex: 1;
}

并且不需要固定宽度。

score 0 · Accepted Answer

Opera 和 IE 不支持这一点，因为它是基于布局的，它可能只用于企业网站，但对于个人来说还可以，因为无论如何您都需要以正常方式对其进行样式设置。

3 回答 3