0

当我制作我的 HTNL 页面时,它看起来很完美,但突然之间,我的页面底部出现了巨大的空白。你可以在http://thomaswd.com/pearinc2看到它。我该如何摆脱这个?!我的样式表位于http://thomaswd.com/pearinc2/style.css

4

3 回答 3

1

如果您查看带有类的 HTML 元素,back-iphone4s您会注意到它使用 CSS 相对定位。

如果您position: relative从 CSS 规则中删除该部分,.back-iphone4s您会注意到它出现在您的空白处。

像这样使用总是很糟糕,如果元素没有相对定位position: relative,空白就会出现在元素的位置。

我建议将其添加position: relative到 divdevices作为其类,然后使用position: absolute;on.back-iphone4s并使用该方法设置它的位置。这样,back-iphone4s元素相对于它的父元素定位,而不是相对于它在正常文档流中的位置。

还有很多其他方法可以解决这个问题,乍一看,我很想把这两部 iPhone 变成一张图片,更少的 HTML,更少的 CSS 和更少的图片下载,但看起来你可能已经有意他们为了一个目的而分开,所以也许这不是一个可行的解决方案。

... 唷,希望这是有道理的,如果现在让我知道。

于 2013-01-25T14:37:03.113 回答
0

给班级height一个:.devices

.devices {height: 520px;}

于 2013-01-25T14:21:57.013 回答
0

我只是快速浏览了一下你的风格,我所看到的在技术上非常难看。您使用 position:absolute 设置所有主要元素,并使它们独立于上下文和内容流。而且因为它们是绝对的,所以你必须给它们一个高度——这会导致像丑陋的空白这样的事情。我会说你对页面的样式/结构有错误的概念。

尝试使用“位置:绝对”非常罕见!

于 2013-01-25T14:30:14.077 回答