无法将边框添加到网页上的元素

我正在试验css的float属性。无法将边框添加到网页上的元素

我试图编码匹配两个浮动div的高度。

两个代码

方法1.

<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 a</div> 
    <div style="background: red;float: right;width: 35%; 
     padding-bottom: 500px;margin-bottom: -500px;border:1px solid White;">column b</div> 
</div>

方法2：

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

代码工作的两个，但我想创建跨columns.I边界应用边框属性，但它没有工作。是否有解决上述代码添加边框和比较与所有浏览器的tible。全长的

被修改代码

方法3

<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

的DIV与列b没有显示边界

在方法1我无法申请边界。任何人都可以提供解决这两个问题。

来源

2012-07-19 user1537788

你在哪里申请边框和你想在哪儿呢？ – SpaceBeers 2012-07-19 12:07:59

问题没有正确提问，重新构建它并使其更加清晰。 – Prateek 2012-07-19 12:19:01

我正在编辑它，请等待 – user1537788 2012-07-19 12:27:39

是的，你可以在你的columnA和columnB中创建另一个div，宽度为100％和边框。

如果您将边框直接添加到您的列div，则35％+ 2px会超过35％，因此您的总和将大于100％。

来源

2012-07-19 12:09:52 odupont

你能解释它是如何是2像素，我已经添加了1px的边框; – user1537788 2012-07-19 12:15:06

这是1px任何一方，所以2px添加到宽度 - http://jsfiddle.net/spacebeers/NcgFf/2/ – SpaceBeers 2012-07-19 12:17:56

很好的例子，但我已编辑的代码，请参阅小提琴http://jsfiddle.net/NcgFf/ 4/ – user1537788 2012-07-19 12:36:13

这应该只是工作：

border: 2px solid red;

什么是你的错误???

来源

2012-07-19 12:07:56 Mathlight

这可能是解决办法：

<div style="overflow: hidden;position: absolute;right: 5px;left: 5px;"> 
    <div style="background: blue; float: left;width: 65%; border: 1px solid #ccc;">column a</div> 
    <div style="background: red; border: 1px solid #ccc;">column b</div> 
</div>

来源

2012-07-19 12:18:45

它可以处理任何屏幕分辨率或大小 – 2012-07-19 12:25:03

无法将边框添加到网页上的元素

回答

相关问题