CSS 为比屏幕宽的元素添加右边距

我的网页上有一组表单，它们是动态生成的，宽度最终比屏幕宽（这不是问题，因为它旨在用相同的问题替换exel电子表格）。

<body>
    <div class='indented-form'>
        <table>
          ... table elements here
        </table>
    </div>
</body>

.css

body {
    margin-right: 0;
    padding: 0;
}
.indented-form {
    margin: 10px;
}

我在包含表格的div 上有"margin：10px"。正如我所期望的那样，这会在页面左侧添加边距，但向右滚动时，表格会到达没有任何边距的边缘。（div 似乎从正文中获取其宽度，而正文又似乎基于浏览器宽度。

如何使其在右侧包含边距，即使表格比浏览器宽？

如果你把你的div作为一个inline-block元素，它会拉伸以适应里面的table：

.indented-form {
    display:inline-block;
    padding: 10px;
}

例

相关内容