开发者社区> 问答> 正文

求助,div设置为absolute定位,高度为父元素的100%,但在IE8下不生效

直接上代码,在jsfiddle下运行正常,但在IE运行不正常

<div class="menu">
    <div class="menu-bar"></div>
    <div class="menu-body">
        <h3>Programs</h3>
        <h3>Documents</h3>
        <h3>Run</h3>
    </div>
</div>  
.menu {
    border: 1px solid black;
    position: relative;
    width: 200px
}

.menu-bar {
    background-color: gray;
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    height: 100%;
}

.menu-body h3 {
    border: 1px solid blue;
    line-height: 30px;
    vertical-align: middle;
    margin: 0 0 0 30px;
}

展开
收起
a123456678 2016-03-25 15:24:44 2857 0
1 条回答
写回答
取消 提交回答
  • 父元素也必须设置指定高度,子元素height:100%才有效,上一级元素如果也height:100%的话,那么外公元素也必须设置指定高度,一直往上推直到它们的老祖宗body和html标签,懂不,所以我在写css的时候基本都是先写上

    html{height:100%}
    body{margin:0;height:100%}
    2019-07-17 19:14:29
    赞同 展开评论 打赏
问答标签:
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载