使div用动态宽度填充父div的剩余水平空间

恩齐奥

我正在尝试使div填充具有动态宽度(基于屏幕宽度)的父div的剩余水平空间。

如何使用纯CSS实现此目标?我试图实现的目标如下图所示(“可填充空间”)。

该图显示了我试图实现的目标

以下示例的代码当前为:

#wrap {
    width: 100%;
    float: left;

    #container {
        width: 100%;
        padding: 0px 30px;

        #static-div {
            width: 60px;
            height: 60px;
        }

        #fillable-space {
            /* What would my code be to fill the remaining space? */
        }
    }
}

谢谢你的问候

达夫布克

我会用

width: calc( 100% - 60px );
float:left;

就像我在这个小提琴中所做的一样:http : //jsfiddle.net/74ovL80s/

以及是否需要支持旧版浏览器,请点击此处查看它们是否支持calc函数:http : //caniuse.com/#feat=calc

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章