Html css：仅使用css定位文本和选择框

仅使用css将文本和选择框水平放置为25%+50%+25%的最佳方式是什么

这就是我们所拥有的：

<div id="mydiv">TextLeft <select id="myselectbox">...</select> TextRight</div>

TextLeft。。。文本权利

我们希望文本左侧居中于左侧25%的区域（宽度可以更改）， 所以TextRight在右边25%的区域居中， 并且，

…

居中

如果可能，请仅使用CSS。

---

谢谢。

HTML中没有足够的结构来满足您的要求。正如安乐所提到的，您可以添加跨距来处理它，如下所示：

使用边距固定使跨距内联块保持其宽度，使其保持在同一直线上。还有其他方法可以解决这个问题，但这可能是没有浮动的最干净的代码

编辑：不是IE6/7快乐

<div id="mydiv">
    <span>TextLeft</span>
    <select id="myselectbox">...</select>
    <span>TextRight</span>
</div>

---

如果您希望CSS随着页面的变化动态地更新和更改文本的位置，那么仅仅使用CSS是不可能的。CSS不是一种在后台运行的有条件语言。这就是JaveScript的用途。添加

span

作为文本，那么在css中处理元素就更容易了。@durbnpoison为什么@为什么是跨距，而不是div？跨距是内联的，而div是块，这意味着跨距是从左到右的，因为div创建段落@阿塔什里瓦萨娃是对的。希望我没有迟到，但你轻松解决了这个问题@Andrew Clody

#mydiv {
    text-align:center;
}

#mydiv > span {
    width:25%;
    display:inline-block;
    margin-left:-4px;
    text-align:center;
}

#myselectbox {
    width:50%;
}