对齐2跨越一个左边，另一个右边跨越div [英] Align 2 span one left and the other right inside a div

问题描述

有人可以写CSS片段来执行此操作吗？

Could anybody write the CSS fragment to do this?

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

下面是 .container / p>

Here's the CSS for .container:

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

请注意，位置是绝对的，因为它的 。

Notice the position is absolute because it is "absolute positionated" on its containing element.

我已经尝试了 float：left / float：right

I've alredy tried float:left/float:right on the two nested elements but nothing happens.

推荐答案

将元素设置为块，设置宽度并浮动它们

Set the elements to block, set a width and float them.

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

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

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

这篇关于对齐2跨越一个左边，另一个右边跨越div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！