html - 仅在标题上使用填充调整标题和内容

Question

我有一个问题，因为在我的代码中我有一个带填充的标题(左和右为 8%)，但是在内容框中我没有填充，当我缩小 firefox 窗口时内容框不一样宽度大于标题(因为标题上的填充改变了这一点)。

所以我希望框内容的宽度始终与标题的宽度相同，并保持滑动条的尺寸。

在滑动条右侧的内容中，我尝试放置相同的填充，但这并没有改变，因为内容框具有定义的宽度。

这是一个代码示例:

<header>
     <div id="logo"></div>
</header>

<div id="box">
    <div id="slidebar"></div>
    <div id="content"></div>
</div>

这就是 JSFIDDLE: https://jsfiddle.net/t2h839dt/(如果缩小 JSFIDDLE 上的预览窗口，就会看到问题(标题和框内容的宽度不同)。

Answer 1

您的代码似乎部分响应。首先，您应该决定要采用哪种方法？固定或响应式布局。请尝试以下链接用于固定布局。

[jsfiddle][1]

[1]: https://jsfiddle.net/antonysuthakarj/hLsaotco/