DIV+CSS 如何让左右两个DIV的高度一致？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了DIV+CSS 如何让左右两个DIV的高度一致？相关的知识，希望对你有一定的参考价值。
我的DIV+CSS布局是#header,#pagebody,#footer,其中#pagebody分成#sidebar和#mainbody，#sidebar是导航栏，可以展开、收缩的那种，#mainbody是主内容，因为各个内容不一样所以高度不固定，#sidebar有个底色，但是底色却不能显示，除了有内容的部分外其它区域是空白，是不是因为#sidebar的高度与#mainbody的高度不一致而导致的这种结果，请各位帮帮忙，谢谢！
参考技术A 最经典的两列自适应高度CSS代码，IE5、6、7，FF下测试通过。希望对你有用： body padding: 0; margin: 0; color:#333/*#0d7206*/; font-size: 14.7px; font-family: Arial, Helvetica, sans-serif; line-height: 140%; text-align: center; background:url(body_bg.jpg) #c8fdcc repeat-x top left; #pagebody width: 760px; margin:10px auto; overflow: hidden; #sidebar border-right:1px #009900 dotted; width: 199px; float: left; background:url(l_bg_contbox.png) #FFF repeat-y left; text-align: left; #mainbody width: 560px; float: left; background:url(r_bg_contbox.png) /*#f6f6f6*/#fff repeat-y right; text-align: left; /* easy clearing */ #pagebody:after content: '[DO NOT LEAVE IT IS NOT REAL]'; display: block; height: 0; clear: both; visibility: hidden; #pagebody display: inline-block; /*\*/ #pagebody display: block; /* end easy clearing */ /*\*/ #sidebar, #mainbody padding-bottom: 32767px !important; margin-bottom: -32767px !important; @media all and (min-width: 0px) #sidebar, #mainbody padding-bottom: 0 !important; margin-bottom: 0 !important; #sidebar:before, #mainbody:before content: '[DO NOT LEAVE IT IS NOT REAL]'; display: block; background: inherit; padding-top: 32767px !important; margin-bottom: -32767px !important; height: 0; /**/ 参考技术B 你的div里面的高度，写成相同的值就可以了，你要display inline block 转成并排的，你在再试试看吧。 参考技术C 如果用纯css实现起来还有点麻烦，实际上是我自己写不出来，因为写出来他的顶部是对齐了的，没瀑布流的感觉推荐lz使用js插件实现
在网上搜下jquery.masonry这个jquery插件，是专门给瀑布流写的，引用其库和css代码就搞定了，是你想要的那种效果
css怎么让div上下居中，靠右对齐
让div还随滚动条移动。
上下居中··这个肯定就要用js算出来了···靠右对齐有很多种方法··position: fixed; right: 0;这样就靠右并且随滚动条滚动·一直固定在位置上···如果你是要做那种右下角的小窗口···纯css是不能解决问题的· 参考技术A position: fixed; top:50%; right:0; margin-top用负div一半的高度的值。就可以上下居中，靠右对齐，但是div得给高度，要不然上下居中就得要用js算出来了 参考技术B 两个DIV同样的外边距就行了.cssDiv 或者把它们装在另一个DIV里面，外面那层DIV设置两边内边距相等如果帮助到您，请记得采纳为满意答案哈，谢谢！祝您生活愉快！ vae.la 参考技术C <html>
<head><title>跟随滚动</title></head>
<script language="javascript">function yidong()
var abc = document.getElementById("leftdiv");
abc.style.top = document.body.scrollTop;
setTimeout("yidong()",6); </script>
<body onload="yidong()">
<div style="height:1600px;">内容显示层</div>
<div id="leftdiv" style="position:absolute;z-index:1; left:10px;" >层内显示</div></body>
</html> 参考技术D <style>
#ad width:150px; height:200px; position:fixed;right:0;top:35%; border:1px solid #0F0
</style>
<div id="ad"></div>
以上是关于DIV+CSS 如何让左右两个DIV的高度一致？的主要内容，如果未能解决你的问题，请参考以下文章