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 回答