Question

我想创建一些HTML。在具有灰色边框的div中，应该有两个水平对齐的div。它们之间应该有一条分隔线。

<div style="width:400px; border-color:#D3D3D3; border-style:solid; border-width:1px;">
<div runat="server" id="plDiv" style="width:300px;">
    one
</div>
<div style="border-left:1px; border-left-style:solid; border-left-color:#D3D3D3; width:100px;">
    other
</div>

我排除了我使用float的所有尝试，因为它没有做我想要的。有人可以帮忙吗？

Answer 1

请看我刚刚在这里发布的答案：

Wrappers size reflecting its contents

这正是你所要求的。

基本上，容器内有2个div，两者之间有分界线：

你可以在这个小提琴中看到这个：http://jsfiddle.net/kWJ79/15/

Answer 2

<div style="width: 400px; border: 1px solid #D3D3D3;; overflow: hidden;">
  <div id="plDiv" style="width: 300px; float: left;" runat="server"> one </div>
  <div style="border-left: 1px solid #D3D3D3; width: 99px; float: left;"> other </div>
</div>

当第二个div的宽度为99px时（考虑到我假设的边框），浮动似乎工作正常。

在另一个div中创建水平对齐的div

2 个答案: