css 具有纯CSS的等大小列。使用底部填充边距技巧,通过overflo将过度折叠元素切割成适当的大小
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了css 具有纯CSS的等大小列。使用底部填充边距技巧,通过overflo将过度折叠元素切割成适当的大小相关的知识,希望对你有一定的参考价值。
<div id="container">
<div id="left-col">
<p>Test content</p>
<p>longer</p>
</div>
<div id="right-col">
<p>Test content</p>
</div>
</div>
#container {
overflow: hidden;
width: 100%;
}
#left-col {
float: left;
width: 50%;
background-color: orange;
padding-bottom: 500em;
margin-bottom: -500em;
}
#right-col {
float: left;
width: 50%;
margin-right: -1px; /* Thank you IE */
border-left: 1px solid black;
background-color: red;
padding-bottom: 500em;
margin-bottom: -500em;
}
以上是关于css 具有纯CSS的等大小列。使用底部填充边距技巧,通过overflo将过度折叠元素切割成适当的大小的主要内容,如果未能解决你的问题,请参考以下文章
CSS 使用百分比和边距、填充或边框
CSS 表格 - 添加边距列和行边框底部
css 表单 - 边距/填充问题 - 包括代码和图像
具有填充和边距以及 100% 宽度的 HTML CSS 框? [复制]
响应式 div 宽度结合固定宽度 div 纯 CSS
UL中的CSS垂直滚动条向左/向右填充可能吗?