Css 无法将字段集中的DIV设置为不超过浏览器宽度_Css

Css 无法将字段集中的DIV设置为不超过浏览器宽度

css

Css 无法将字段集中的DIV设置为不超过浏览器宽度,css,Css,当我嵌套一个DIV时，我可以使内部DIV与浏览器宽度的外部DIV相匹配，并且只需为内部DIV中的内容提供一个滚动条： <body> <div style="width:100%; border: thick dotted blue"> <div style="width:99%; overflow: auto; border: thick dotted green"> ======================

当我嵌套一个DIV时，我可以使内部DIV与浏览器宽度的外部DIV相匹配，并且只需为内部DIV中的内容提供一个滚动条：

<body>
    <div style="width:100%; border: thick dotted blue">
        <div style="width:99%; overflow: auto; border: thick dotted green">
            ================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================
        </div>
    </div>
</body>

当我尝试用字段集做同样的事情时，DIV只会向右偏离页面，尽管宽度：100%。下面代码的唯一浏览器是在Internet Explorer中按我所希望的方式工作的。在Firefox和Chrome中，它超过了我的浏览器宽度：

<body>
    <div style="width:100%;">
    <fieldset style="width:100%;">
        <legend>test</legend>
        <div style="width:100%;  overflow: auto;">
            ================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================
        </div>
    </fieldset>
    </div>
</body>

如何使字段集代码像上面的代码一样工作，并且其内容不超过浏览器的宽度？

在进一步搜索后，我在 . 基本上，您必须将以下CSS添加到您的站点/页面，以便字段集在基于Gecko的浏览器中按照我希望的方式运行：

@-moz-document url-prefix() {
    fieldset {
        display: table-cell;
    }
}