请教css高手:子容器高度占满父容器高度应该怎么做?
比如有这样一个布局:<divid="ward"><divid="top"></div><divid="content"><divid="left"></div<divid...
比如有这样一个布局:
<div id="ward">
<div id="top"></div>
<div id="content">
<div id="left"></div
<div id="right"></div>
</div
<div id="tutton"></div>
</div>
这是一个简单得两列布局
当content不设置高度,它得高度会根据right得内容自适应,问题来了left高度要怎么要怎么样才能跟content得高度一样?我设置过left得height为100%但是没用.
最佳答案
父容器content的position属性设置为relative,left的position属性设置为absolute,top:0 left 0
但是.又发现问题了.像你那样是可以得.不过content就不会根据left自适应了.有没有办法解决吖?麻烦你了. 展开
<div id="ward">
<div id="top"></div>
<div id="content">
<div id="left"></div
<div id="right"></div>
</div
<div id="tutton"></div>
</div>
这是一个简单得两列布局
当content不设置高度,它得高度会根据right得内容自适应,问题来了left高度要怎么要怎么样才能跟content得高度一样?我设置过left得height为100%但是没用.
最佳答案
父容器content的position属性设置为relative,left的position属性设置为absolute,top:0 left 0
但是.又发现问题了.像你那样是可以得.不过content就不会根据left自适应了.有没有办法解决吖?麻烦你了. 展开
1个回答
展开全部
我给你写一个简单的 你参考参考
<div id="ward" style=" width:500px; background-color:#000; margin-left:auto; margin-right:auto;">
<div id="top" style="width:500px; height:30px; background-color:#009900;"></div>
<div id="content" style=" border:1px solid red;">
<div id="right" style=" float:right; width:300px; height:30px; background-color: #CCFF00"></div>
<div id="left" style=" height:30px; background-color: #0099FF; overflow:hidden;"></div>
</div>
<div id="tutton" style=" width:500px; height:30px; background-color:#996600"></div>
</div>
<div id="ward" style=" width:500px; background-color:#000; margin-left:auto; margin-right:auto;">
<div id="top" style="width:500px; height:30px; background-color:#009900;"></div>
<div id="content" style=" border:1px solid red;">
<div id="right" style=" float:right; width:300px; height:30px; background-color: #CCFF00"></div>
<div id="left" style=" height:30px; background-color: #0099FF; overflow:hidden;"></div>
</div>
<div id="tutton" style=" width:500px; height:30px; background-color:#996600"></div>
</div>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询