将一个元素水平居中，并将另一个元素置于其右侧

Question

正如标题所示，我试图将一个元素水平居中，并将另一个元素放在它的右边，而不将两个元素居中。我只希望两个元素中的一个居中，而另一个位于它的右侧（在本例中位于同一条线上）。

下面是我能得到的最接近的，但这两个元素都居中，而不仅仅是包含“CENTER”的元素。我希望“CENTER”居中，“right”位于其右侧：

<div style=“text-align:center；”>CENTER中心右侧</div>

我也尝试过：

<div style=“text-align:center；”>CENTER中心</div>右侧

这会使带有“right”的元素转到下一行。使用text-align:center将display:inline添加到我的div中只会取消任何居中。

有什么办法可以做到这一点吗？有很多关于集中注意力的信息，但似乎没有什么能回答我想做的。

Answer 1

试试这个-http://jsfiddle.net/dGSDF/2/

#中心{位置：相对；高度：100px；宽度：60%；边距：自动；背景：米色；}#右{位置：绝对；右：-20%；/*div的宽度*/顶部：0；宽度：20%；背景：橙色；高度：100px；}

<div id=“center”>中心右</div>