使div比其包含的div小30px

Question

我在另一个div里面有一个div。外部div具有百分比宽度（80％），并且我希望内部div的宽度比外部div的宽度小30px。我该怎么做呢？我假设我需要使用javascript？ 提前谢谢。

Answer 1

使用边距：

​<div style="width:80%;"> 
    <div style="margin-left:15px;margin-right:15px;"> inner </div>
</div>​​​​​​​​​​​​​

demonstration

Answer 2

@dystroy有一个很好的答案，虽然缺乏动态的自定义。

我的观点，使用CSS变量。

你必须做这样的事情：

#parent-div
{
    var-width: 100px; /* Or something else? */
    //Notice that though the attribute is named var-width, the browser will
    //treat it as width and will use the `var-` prefix as directive
    //so that the calculations can be performed by using it as variable.
}
#child-div
{
    width: calc(var(width) - 30);
}

这将使CSS计算孩子的宽度。

更多相关信息，here.