手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >利用margin实现等高布局
利用margin实现等高布局
摘要:我是左边的内容的啦啦啦啦。。。。我是左边的内容的啦啦啦啦。。。。我是左边的内容的啦啦啦啦。。。。我是左边的内容的啦啦啦啦。。。。我是左边的内...

<div id="main">

<div id="left">

我是左边的内容的啦啦啦啦。。。。

我是左边的内容的啦啦啦啦。。。。

我是左边的内容的啦啦啦啦。。。。

我是左边的内容的啦啦啦啦。。。。

我是左边的内容的啦啦啦啦。。。。

</div>

<div id="right">

左边的内容...哈哈哈哈哈

</div>

</div>

<style>

#main{

overflow:hidden;

width:500px;

margin:0 auto;

}

#left{

float:left;

width:390px;

background:#eee;

}

#right{

float:right;

width:100px;

background:#ccc;

}

#left,#right{

margin-bottom:-1000px;

padding-bottom:1000px;

}

</style>

overflow:hidden;

margin-bottom:-1000px;

padding-bottom:1000px;

非常巧妙的利用了 margin 做到了等高布局。只是一个看起来的。实际上高度不相等的。只是隐藏了超出的部分

【利用margin实现等高布局】相关文章:

用CSS实现表单form布局

用CSS实现简单的进度条

用CSS实现表格背景颜色渐变效果

八种创建等高列布局

CSS+jQuery实现的在线答题功能

纯CSS实现漂亮tab选项卡切换特效

用css实现透视效果

CSS3 media queries + jQuery实现响应式导航

利用CSS3实现毛玻璃效果示例源码

文字环绕图片的布局效果

精品推荐
分类导航