Question

我正在尝试制作一个无限圆形矩形，但我似乎无法达到最高要求...继承人看起来像...... http://animactions.ca/Animactions/accueil.php

你会注意到圆形底部的底部很好，但是我已经尝试了几个小时来找出顶部。感谢

抱歉，网站上传失败了，现在已经失败了

问题http://img511.imageshack.us/img511/6272/probleml.png

的图片

HTML

<div id="page_content">
<div id="top">&nbsp;</div>
<div id="middle">

    <h1>Site under construction</h1>
    <p>Hello, this Web Site is not done yet, sorry.... </p>

</div>
<div id="bottom">&nbsp;</div>

    </div>

CSS

#top {
    background-position: center bottom;
    background: url('Images/RoundRect/top.png') no-repeat center
bottom;
    height : 12px;
    padding : 0;
    margin: 10px auto 0 auto;
    width: 910px;
}

#middle {
    background-position: left top;
    padding: 0;
    margin: 0 auto 0 auto;
    width: 910px;
    height: 5em;
    background-repeat: repeat-y;
    background-image: url('Images/RoundRect/middle.png');
}

#bottom {
    background-position: center top;
    background: url('Images/RoundRect/bottom.png') no-repeat center
top;
    height : 12px;
    padding : 0;
    margin: 0 auto 10px auto;
    width: 910px;
}

Answer 1

这是因为h1元素。它在顶部创建了一个边距。将其添加到您的CSS：

h1 {margin-top: 0px}

如果您使用Firefox，请安装Firebug。它是调试HTML代码的一个很好的工具，还突出显示了元素的填充和边距区域。

圆形矩形顶部不起作用

1 个答案: