css - 响应式填充问题

Question

我为教程设计了一个响应式网页，但遇到了不必要的填充问题。

http://zinzinzibidi.com/res

在此页面中，当您降低浏览器窗口分辨率时，您会在某些分辨率下看到水平滚动条 (overflow-x)。我正在尝试了解，但我几天无法解决这个问题。

这是我的麻烦的示例图片:

我的 CSS 代码在这里:http://zinzinzibidi.com/Areas/res/Content/css/style.css

我的媒体屏幕代码是

我做错了什么？

Answer 1

问题似乎是由内部元素引起的。从#header-main-buffer 中删除填充，它应该会消失。

您文件的第 515 行:

#header-main-buffer {
    width: 300px;
    padding: 0 10px; <- this is your problem. remove it and it will be fixed
    ...