Div 2跨度，居中1，右对齐其他，但保持第一个居中

Question

我有一个2跨度的div。我想保持第一个跨度相对于div居中，然后右对齐第二个（我从bootstrap使用拉右）。

在下面的JSBin中，你会看到我在做什么。我希望Div1中的'Hello'跨度与Div2中的位置相同。 。换句话说，我想中心相对于父第一跨度，而不是在div任何其他跨度的影响...

这里是我的jsbin：http://jsbin.com/cixun/1/

Answer 1

一种选择是定位正确span绝对，相对div：

http://jsbin.com/wuged/1/edit

.row{ 
    position: relative; 
} 

.right{ 
    position: absolute; 
    right: 0; 
} 

<div class="row black center" > 
    <span class="first">Hello</span> 

    <span class="right">more text on the right</span> 
</div> 

Answer 2

这样做的最好方法是绝对定位右跨度，而不是将其浮动。这将拿出来的流量，另跨度不会”的‘感觉’它，并在页面

CSS

.row{position:relative;} /*required to make this a positioning container for abs.  
      positioned span */ 
.right{position:absolute;right:0px;} 

中心更正确地