Question

我正试图删除边框，但我不能。 border：none，border-style：none; border-width：0px或没有border的定义。我尝试了所有这些标题，但每当我尝试时，div就会移动。

border:none

这就是边框（任何样式）的样子

enter image description here

这些是2.情况的其余css代码和html代码。 CSS：

body{
top:0px;
text-align:center;
background-color:#F3F3F3;
margin:0px;
}

div#baslik{
top:0px;
width:800px;
height:230px;
border-style:solid;
margin-left:auto;
margin-right:auto;
background-image:url('/gorsel/baslik.jpg');
}

div#siteler{
text-align:right;
height:55px;
width:800px;
padding-bottom:5px;
bottom:0px;
margin-top:195px;
padding-right:30px;
}

a:visited,a:link.siteler{
padding-right:10px;
padding-left:10px;
}

img:hover.siteler{
-moz-box-shadow:0px 0px 10px #FFF;
-webkit-box-shadow:0px 0px 10px #FFF;
box-shadow:0px 0px 10px #FFF;
}

img.siteler{
width:30px;
height:30px;
}

HTML：

<!DOCTYPE html>
<html>
<head>
    <title>BAŞLIK</title>
    <link rel='stylesheet' type='text/css' href='tema.css'>
    <meta http-equiv='Content-Type' content='text/HTML; charset=utf-8' />
    <link rel='shortcut icon' href='/gorsel/favicon.ico' type='image/x-icon' />
</head>
<body>
    <div id='baslik'>
        <div id='siteler'>
            <a class='siteler' href=#><img class='siteler' src='/gorsel/facebook.jpg'></a>
            <a class='siteler' href=#><img class='siteler' src='/gorsel/rss.jpg'></a>
            <a class='siteler' href=#><img class='siteler' src='/gorsel/twitter.jpg'></a>
            <a class='siteler' href=#><img class='siteler' src='/gorsel/planetminecraft.jpg'></a>
            <a class='siteler' href=#><img class='siteler' src='/gorsel/youtube.jpg'></a>
        </div>
    </div>
</body>
</html>

Answer 1

这是margin collapsing。当#baslik具有顶部边框或顶部填充时，它包含内部#siteler的上边距。当没有边框或填充分隔它们的边距时，它们会合并为一个边距，使它们都移动。

要阻止它，您可以从margin-top:195px;移除#siteler，并将height:230px;替换为height:35px; padding-top: 195px #baslik。

div没有边界

1 个答案: