html – 如何使左浮动div占用剩余空间的100%?

前端之家收集整理的这篇文章主要介绍了html – 如何使左浮动div占用剩余空间的100%?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

如果我有一个75%宽度的容器,内部,左侧和右侧两列,左侧宽度为10em,我如何获得正确的容器占用剩余空间的100%?

我试了这个没有运气:

html,body {
    margin:0;
    padding:0;
    width:100%;
    height:100%;
}
#container {
    position:relative;
    width:75%;
    margin:0 auto;
    background:blue;
}
#left-container {
    position:relative;
    float:left;
    height:100%;
    width:10em;
    background:red;
}
#right-container {
    position:relative;
    float:left;
    height:100%;
    width:100%;
    background:yellow;
}

我可以用百分比轻松地做到这一点,但我需要留下固定的10em宽度.

最佳答案
您可以通过删除float:left,删除宽度并添加overflow:隐藏到右侧div,使框元素占用空间的剩余部分

Working example

#right-container {
    position:relative;
    overflow: hidden;
    height:100%;
    background:yellow;
}

猜你在找的HTML相关文章