应用的相对尺寸，其包括页边距

我有一个div其width是100%。我知道我可以使用box-sizing（或-moz-box-sizing）设置为border-box吃出div的总宽度，包括边框和填充（但不是保证金），以是计算的100％。有没有办法在相对大小计算中包含边距？应用的相对尺寸，其包括页边距

或者，这将是巨大的，如果有一个宽度指定相对和绝对尺寸的组合非JavaScript方式，例如：

#my-div { 
    width: 100% - 10px; 
}

可以任一做？

来源

2010-02-25 Matt Ball

这将有助于了解什么是你的观点，但我们知道这一切 - 我建议你使用具有宽度和填充包装div或只是有宽度和my-div有宽余：

<div id="wrapper"> 
    <div id="my-div"> 
    content 
    </div> 
</div>

CSS：

#wrapper { width: 450px; padding: 25px; } /* i.e. relative 100% = 450px now */ 
    #my-div { margin: 20px; } /* there. now we have 100% - 40px width :] */

类似的东西？

来源

2010-02-25 20:58:35

我想我的div来填满整个窗口，除了小左，右页边距，不管窗口大小。 – 2010-02-25 21:18:34

所有需要工作的是添加到包装的CSS：'box-sizing：border-box'，以便它包含填充的宽度。而我的内部div（“'＃my-div'”）需要'width：100％'属性，因为它有'display：table'（这是* its * children所需要的......不要问）。谢谢！ – 2010-02-25 21:29:03

：D我不喜欢'box-sizing'和'display：table'作为他们相当*支持的*支持。 – 2010-02-25 21:31:21

亚当回答了这个问题。我唯一的补充是，你不应该把< div/>的宽度设置为100％。你可以免费获得，而设置它只会给你带来问题。

来源

2010-02-25 21:15:51 Robusto

应用的相对尺寸，其包括页边距

回答

相关问题