Scripticus
Mitglied
Liebe Community,
mein Problem ist das ich nicht weiß wie ich mein Hover-Drop-Down-Menü zu Zentrieren.
(Ich meine genauso wie wenn nicht <p style="align:center">Hallo</p> zentriere)
Hoffe ihr könnt mir helfen
Mfg
Scripticus
mein Problem ist das ich nicht weiß wie ich mein Hover-Drop-Down-Menü zu Zentrieren.
(Ich meine genauso wie wenn nicht <p style="align:center">Hallo</p> zentriere)
Hoffe ihr könnt mir helfen
Mfg
Scripticus
Code:
@charset "utf-8";
/* CSS Document */
body {
background:#222;
font-family:Helvetica;
} /*Farbe usw*/
h1 {
/*width: 720px; */
color: #E5E5E5;
text-align: center;
}
/*Links einstellungen*/
a:link {
color:#E5E5E5;
text-decoration:none;
}
a:visited {
color:#E5E5E5;
text-decoration:none;
}
a:active {
color:#E5E5E5;
text-decoration:none;
}
a:hover {
color:#E5E5E5;
text-decoration:none;
}
/*menü*/
nav {
position:absolute;
top:50px;
left:50px;
}
nav ul {
display: table;
margin: auto;
/* margin:0;
height:40px;
width:auto;
float:left;*/
border-radius:15px;
/* padding:0; */
border-bottom:0px solid #222;
}
nav ul li {
position:relative;
padding:15px;
float:left;
list-style:none;
color:#E5E5E5;
background:#333;
width:75px;
text-align:center;
border-right:1px solid #444;
transition:all 900ms;
}
nav ul li:hover { /*farbe hover*/
background:#0080FF;
color:#E5E5E5;
}
nav ul li:last-child {/*letztes hover*/
border-radius:0 10px 10px 0;
}
nav ul li:first-child {/*erstes hover*/
border-radius:10px 0 0 10px;
}
/*Untermen+*/
nav ul li:hover ul {
height:auto;
opacity:1;
}
nav ul li ul
{
position:absolute;
top:48px;
left:0;
transition:all 900ms;
opacity:0;
overflow:hidden;
height:0;
}
nav ul li ul li {
width:150px;
text-align:left;
}
nav ul li ul li:last-child {/*unten hover*/
border-radius:0 0 10px 10px;
}
nav ul li ul li:first-child {/*oben hover*/
border-radius:0 10px 0px 0px;
}