2

我尝试设计的网页似乎只适合 1024x768 分辨率。当分辨率较高时,屏幕底部会出现大量空白区域。我对 CSS 很陌生,但我很确定这个错误与缺少 position 属性有关。我要么希望页脚和主 div 转到屏幕底部,要么让页面缩放。如果有人能告诉我我错过了什么,我将永远感激不尽。

http://www.eightbitbastards.com/8bbtest/index.html

4

2 回答 2

1

在 html 和 body 上使用 100% 高度并在包装器上使用 100%,包括对元素的绝对定位,即:

html, body {
    height: 100%;
}

#wrapper {
    background-image: url("../images/bg-repeat.png");
    background-repeat: repeat;
    height: 100%;
    min-width: 768px;
    position: relative;
}

#main {
    bottom: 21px; /* lifting it up 21px from bottom to allow for footer slotting in */
    height: auto;
    left: 0; /* change accordingly to left position */
    min-height: 309px;
    position: absolute;
    width: 768px;
}

然后,您还希望页脚保持在底部 - 将其设置为绝对定位,底部为 0。此外,我会在内部使用类#wrapper而不是 id。

于 2013-07-02T00:35:37.020 回答
0

将包装器 div 上的背景添加到页面主体。

body {
     background-image: url(http://www.eightbitbastards.com/8bbtest/images/bg-repeat.png);
     background-repeat: repeat;
}
于 2013-07-02T00:43:12.450 回答