DIV问题的总宽度

我有一个DIV部分，希望将它用作各种环境中的“组件”。对于“组件”，我的意思是它将被自动包含在HTML页面的一些无法预见的地方。DIV问题的总宽度

DIV部分所需的行为是宽度应始终为100％，这意味着它应完全填充父项。出现问题的原因是DIV的总宽度是内部宽度+填充+边距的总和。我对DIV部分垫衬有：

padding-left: 10px; padding-right: 10px;

的问题是：我应该如何设置DIV部分的宽度时，我不知道父母的宽度，但想成为100％？没有像100％ - 2 * 10px的...

Preferrably，我不会用JavaScript或JQuery的为这种布局的问题。

由于提前，
兹拉特科

来源

2010-01-27 Zlatko

如何嵌套的DIV？

<html> 
<head> 
    <title>Div Test</title> 
</head> 
<body> 
    <div class='outerDiv' style=' background-color: red;margin: 0px; padding: 0px 10px;'> 
    <div class='innerDiv' style='width: 100%; background-color: yellow; margin: 0px; padding: 0px;'> 
    Whatever 
    </div> 
    </div> 
</body> 
</html>

希望这会有所帮助。

来源

2010-01-27 11:50:17 Yeodave

保留宽度auto。除非你正在做一些浮动的东西，例如浮动显示器（你不应该这样做，因为你试图达到的目的）会导致宽度使用剩余的空间。

来源

2010-01-27 11:53:00 Quentin

这就是box-sizing属性。见this guide。

来源

2010-01-27 11:53:08

这永远不会是现实世界中任何问题的解决方案。我建议忘记它甚至存在。 – U62 2010-01-27 11:59:56

您可以从组件中删除填充，这可以直接解决您的问题。不过，我假设你出于某种原因不会/不能这样做。因此，如果组件div始终位于父div内，那么如何将父div的溢出设置为隐藏。只需将此添加到父元素的CSS：

.parent {overflow: hidden;}

流过父母任何现在应该被隐藏。

来源

2010-01-27 12:20:18 Tom

DIV问题的总宽度

回答

相关问题