无法在网页中的元素上设置完整边框

Question

我正在试验 css 的 float 属性。

我已经尝试编写代码匹配两个浮动 div 的高度。

参考问题

How might I force a floating DIV to match the height of another floating DIV?

Question on issue of border with floating div

已编辑

我想根据两个div之间div的最大高度来调整边框的高度和长度

  <div style="background-color: yellow;">
    <div style="float: left;width: 65%; border-right:1px solid White;">
   column acolumn acolumn acolumn acolumn acolumn acolumn acolumn 
   acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn 
   acolumn   acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn 
    </div>
    <div style="float: right;width: 35%;border-right:1px solid White;">column b</div>
    <div style="clear: both;"></div>
   </div>

Please see the jsfiddle

具有 b 列的 div 未显示全长边框

在下面的代码中我无法添加边框

  <div style="overflow: hidden;">
   <div style="background: blue;float: left;width: 65%;padding-bottom: 500px;
     margin-bottom: -500px;border:1px solid White;">column a<br />
     column acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn 
     acolumn  acolumn acolumn acolumn acolumn acolumn acolumn acolumn a
   </div>
   <div style="background: red;float: right;width: 35%;
  padding-bottom: 500px;margin-bottom: -500px;border:1px solid White;">column b
   </div>
</div>

谁能提供解决问题的方法。

Answer 1

如果我猜对了，您想为父母填写高度，您应该为父母 div 指定高度。

Round columns without width adjusted and border divs inserted
<div style="background-color: yellow; height: 500px;">
    <div style="float: left;width: 65%; height: 100%;">
        <div style="width: 100%; height: 100%;border: 1px solid red;">column acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn acolumn a</div></div>
  <div style="float: right;width: 35%; height: 100%;">
      <div style="width: 100%; height: 100%;border: 1px solid red;">column a</div></div>
  <div style="clear: both;"></div>
</div>
​

我希望这会有所帮助。