html - 在 div 内对齐 2 个跨度，一个向左，另一个向右

Question

有人可以编写 CSS 片段来做到这一点吗？

<div class="container">
  <span class="left">Left</span><span class="right">Right</span>
</div>

这是 .container 的 CSS:

.container {
    position:absolute;
    bottom:0;
    margin: 0 5px 5px 5px;
}

请注意该位置是绝对位置，因为它在其包含元素上是“绝对定位”的。

我已经在两个嵌套元素上尝试了 float:left/float:right 但没有任何反应。

Answer 1

设置要阻塞的元素，设置宽度并 float 它们。

.left{
  display: block;
  float:left;
  width: 100px;
}

.right{
  display: block;
  float:right;
  width: 100px;
}

示例:http://jsfiddle.net/LML2e/