发新话题
打印

子div高度随父div, 父div高度不固定

子div高度随父div, 父div高度不固定

最近研究div时碰到了一个问题, 顺便把解决方法写出来.

问题: 子div高度随父div, 父div高度不固定

第一种方法: css控制
复制内容到剪贴板
代码:
body{margin:0px; font-size:13px; text-align:center; margin:0px;}
#main{width:785px; font-size:13px; margin:0px auto; background:yellow; overflow:hidden;}
#m_left{width:173px; float:left;}
#m_center{width:10px; float:left; background:#B8B874; padding-bottom:1000px; margin-bottom:-1000px;}
#m_right{width:602px; float:right;}


< div id="main">
< div id="m_left">
   左边
</ div>
< div id="m_center"><!--背景色-->
</ div>
< div id="m_right">
   右边
< /div>
< /div>
这段代码在ie 火狐下显示都正常.  但网页内容不至于就这一块.  在这块div上,如果再加div的话, 在火狐下就显示不正常了,原因就是mian里的 overflow:hidden 影响. 其实这overflow 在ie下都无所谓.  
最后还是用js解决了.


方法二:(js控制)
复制内容到剪贴板
代码:
< div id="main">
< div id="m_left">
   左边
</ div>
< div id="m_center"><!--背景色-->
< /div>
< div id="m_right">
   右边
</ div>
</ div>
< script type="text/javascript">
   <!--
   document.getElementById("m_center").style.height=document.getElementById("m_left").scrollHeight+"px"
   -->
</ script>

TOP

脚本。看不懂....

TOP

发新话题