如何修改页眉和页脚以在更改浏览器窗口大小时正确显示？

Question

如果您将浏览器缩小到较小的尺寸，我的网站页眉和页脚颜色 被删除了。如果你缩小你的浏览量，你会意识到我的意思。 如果你最小化互联网浏览器的窗口，这是我的网站发生了什么。这并不容易解释，因为它在最大化的浏览器窗口上完全加载。我的网站网址是www.virmodrosti.com

以下是style.css

的代码

#footer {
 margin: 0 auto;
 width: 100%;
 background: #0b3e61;
 color: #CCD8E4;
 padding: 12px 0;
 font-size: 12px;
}

#footer a {
 font-size:14px;
 font-weight: bold;
 color: #ABB9C7; 
 text-decoration: none;
}

#footer a:hover {
 color: #ABB9C7; 
 text-decoration: underline;
}

#header {
 background-color: #0A3952;
 padding: 4px 0 20px 0; 
}

#header .menu {
 display: inline-block;
 float: left;
 padding-top: 60px;
 font-size: 15px;
 text-transform: uppercase; 
 line-height: 40px;
}

body {
 background: #DEDEDE;
 font-family: Frutiger, Lato, Georgia, serif;
 font-size: 13px; 
}

#wrapper { 
 margin: 0 auto;
 width: 100%; 
}

#wrapper2 { 
 margin: 0 auto;
 height: 86px;
 width: 1180px; 
}

请告诉我，为了正确显示，我需要在style.css中进行哪些更改？

Answer 1

在您的代码中，您有：

#main {
    margin: 0 auto;
    width: 1180px;
    padding: 20px 20px;
}

宽度设置为1180px，因为窗口大小正在缩小，如果有意义的话，它会保持不变并且比标题拉伸得更远。