0

我正在为我朋友的业务建立一个网站，主页由图像和 iframe 组成，但 iframe 上方和下方都有一个空白区域。我已经尝试了我能找到的所有技巧，但仍然没有运气。屏幕截图：http : //i.stack.imgur.com/eBoZs.jpg

的HTML：

<!doctype html>
<html>
<div id="center">
<head>
    <title>Inali Grimalkin Sewing and Parties</title>
    <meta charset="UTF-8">
    <link rel=stylesheet href=css/styles.css>
    <meta name=description value="Inali Grimalkin specializes in cosplay, plushies, clothing, and anything that can be made out of fabric.">
    <meta name=keywords value="cosplay, clothing, fabric, sewing, parties, princess, plushies, anime, fandom, conventions">
</head>

<body>

<img src="images/bkg1.jpg" /><a href="shop.html"><img src="images/bkg2.jpg" /></a><a href="gallery.html"><img src="images/bkg3.jpg" /></a><a href="contact.html"><img src="images/bkg4.jpg" /></a>
<img src="images/bkg5.jpg" /><iframe src="indexcontent.html" width="516" height="307" seamless></iframe>

</body>
</div>
</html>

上面包含的图像和居中 div 的 css：

img {
    float: left;
    margin: 0px;
    padding: 0px;
    }

#center {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 998px;
    height: 366px;
    margin-left: -499px;
    margin-top: -183px;
    }

iframe 链接的页面 indexcontent.html 包含一个 div id：

#content {
    background: url('../images/bkg6.jpg') fixed;
    margin: 0px;
    padding: 0px;
    }

如何让 iframe 与上面的图像齐平？iframe 下方的空白区域不是问题，因为它下方没有图像，但顶部的空白区域会中断布局。这在 Chrome 和 Firefox 中都会发生，在 Firefox 中，iframe 会出现在图像下方而不是图像旁边。

4

0 回答 0