Eliminierung des oberen Bereichs eines horizontalen Menüs

Question

Ich möchte ein horizontales Menü erstellen, das direkt am oberen Rand der Seite beginnt, was bedeutet, dass ich keinen Rand darüber haben möchte, aber ich weiß nicht, wie das geht. Ich habe versucht, mit top: 0; margin:auto;, aber es funktioniert nicht ... mein CSS-Code ist hier richtig:

.menu1 
{ 
    position: absolute; 
    top: 0; 
    margin:auto; 
    left: 0; 
    right: 0; 
    width: 100%; 
} 
.menu1 ul 
{ 
    list-style-type: none; 
    padding: 0; 
    overflow: hidden; 
    height: 30px; 
    background-color: purple; 
} 

.menu1 li 
{ 
    float:left; 
    margin-right: 10px; 
} 

.menu1 li a 
{ 
    display: block; 
    color: white; 
    text-align: center; 
    padding: 8px 10px; 
    text-decoration: none; 

} 

.menu1 li a:hover 
{ 
    text-decoration: underline; 
} 

Answer 1

hinzufügen margin: 0; in .menu1 ul

und alles wird gut.

Sehen Sie den Code unten

dank

.menu1 
 
{ 
 
    position: absolute; 
 
    top: 0; 
 
    margin:auto; 
 
    left: 0; 
 
    right: 0; 
 
    width: 100%; 
 
} 
 
.menu1 ul 
 
{ 
 
    list-style-type: none; 
 
    padding: 0; 
 
    overflow: hidden; 
 
    height: 30px; 
 
    background-color: purple; 
 
    margin:0; 
 
} 
 

 
.menu1 li 
 
{ 
 
    float:left; 
 
    margin-right: 10px; 
 
} 
 

 
.menu1 li a 
 
{ 
 
    display: block; 
 
    color: white; 
 
    text-align: center; 
 
    padding: 8px 10px; 
 
    text-decoration: none; 
 

 
} 
 

 
.menu1 li a:hover 
 
{ 
 
    text-decoration: underline; 
 
}

<div class="menu1"> 
 
    <ul> 
 
    <li>one</li> 
 
    <li>one</li> 
 
    <li>one</li> 
 
    <li>one</li> 
 
    </ul> 
 
    </div>

Answer 2

body, html, .menu { margin:0 auto; } 

Answer 3

Stil hinzufügen kann es hilft Ihnen

*{margin:0px 0px; padding:0px 0px;} 

Answer 4

Sie haben zwei Möglichkeiten.

1: *{margin:0px 0px; padding:0px 0px;}

2: Verwenden Sie CSS zurücksetzen