Ik heb hem al op me bureaublad, momentje
[HTML/CSS] Menu knoppen
Is goed hoor.
Haal de hight en width: 100% eens weg?
ul#menu li a {
color: black;
border: #000 solid 1px;
background: white;
display: block;
height: 100%; // Weg
width: 100%; // Weg
}Hoe breed en hoe hoog wil je ze hebben.
toevoeging op 20 maart 2012, 20:22:40:
Helemaal over de breedte?
toevoeging op 20 maart 2012, 20:22:40:
Helemaal over de breedte?
Breed (horizontaal) gewoon dat in dat vakje past
Hoogte maakt niet echt uit, als ie maar in dat vakje zit
Nu steekt ie uit
toevoeging op 20 maart 2012, 20:24:23:
Geen verschil verandert niets?
Hoogte maakt niet echt uit, als ie maar in dat vakje zit
Nu steekt ie uit
toevoeging op 20 maart 2012, 20:24:23:
Drakonfly schreef:Haal de hight en width: 100% eens weg?
ul#menu li a {
color: black;
border: #000 solid 1px;
background: white;
display: block;
height: 100%; // Weg
width: 100%; // Weg
}Geen verschil verandert niets?
Spoiler tonen
body {
font-family: Arial;
background-color: #ED2129;
}
#container {
margin: 0px auto;
padding: 5px;
width: 990px;
height: auto;
}
#header {
width: 990px;
height: 170px;
background: url(http://azdin.s2.one2xs.com/header.png);
color: #000000;
font-size: 48px;
font-style: normal;
font-weight: bold;
text-decoration: none;
text-align: center;
text-transform: none;
}
#nav {
border: 1px solid silver;
margin-left: 12px;
width: 150px;
float: left;
background: white url(../images/header.png) repeat-x;
}
#nav ul {
list-style: none;
}
#section {
border: 1px solid silver;
margin-right: 12px;
width: 812px;
float: right;
background-color: white;
background: white url(../images/header.png) repeat-x;
text-align: center;
}
ul#menu {
list-style: none;
width: 100px;
padding-top: 35px;
padding-left: 0px;
}
ul#menu li {
margin-top: none;
}
ul#menu li a {
color: black;
border: #000 solid 1px;
background: white;
display: block;
height: 25px; /* Hoe hoog je de menu knoppen wilt hebben */
width: 148px; /* Hoe breed je de menu knoppen wilt hebben */
text-align: center;
padding-top: 5px;
}
ul#menu li a:hover {
background: black;
color: white;
border: #000 solid 1px;
display: block;
}Hij zit nu al veel beter, zie: http://azdin.s2.one2xs.com/
Alleen, dat vakje met home moet tegen dat zwarte vakje zitten, nu zit er wat witte ruimte tussen?
Alleen, dat vakje met home moet tegen dat zwarte vakje zitten, nu zit er wat witte ruimte tussen?
Dus de hoogte moet minder?
Ja hij moet gewoon precies tegen dat zwarte vakje
Oke momentje.
En hoe komt het dat de tekst in het menu onderstreept is? Kan dat niet weg?
Ja dat kan wel weg
toevoeging op 20 maart 2012, 20:34:20:
Zo een beetje goed?
toevoeging op 20 maart 2012, 20:34:20:
Zo een beetje goed?
Spoiler tonen
body {
font-family: Arial;
background-color: #ED2129;
}
#container {
margin: 0px auto;
padding: 5px;
width: 990px;
height: auto;
}
#header {
width: 990px;
height: 170px;
background: url(http://azdin.s2.one2xs.com/header.png);
color: #000000;
font-size: 48px;
font-style: normal;
font-weight: bold;
text-decoration: none;
text-align: center;
text-transform: none;
}
#nav {
border: 1px solid silver;
margin-left: 12px;
width: 150px;
float: left;
background: white url(../images/header.png) repeat-x;
}
#nav ul {
list-style: none;
}
#section {
border: 1px solid silver;
margin-right: 12px;
width: 812px;
float: right;
background-color: white;
background: white url(../images/header.png) repeat-x;
text-align: center;
}
ul#menu {
list-style: none;
width: 100px;
padding-top: 35px;
padding-left: 0px;
}
ul#menu li {
margin-top: none;
text-decoration:none;
}
ul#menu li a {
color: black;
border: #000 solid 1px;
background: white;
display: block;
height: 5px; /* Hoe hoog je de menu knoppen wilt hebben */
width: 148px; /* Hoe breed je de menu knoppen wilt hebben */
text-align: center;
padding-bottom: 10px;
text-decoration:none;
}
ul#menu li a:hover {
background: black;
color: white;
border: #000 solid 1px;
display: block;
text-decoration:none;
}Laatste vraag:
http://azdin.s2.one2xs.com/index.html
Zie je onder dat menu (onder contact vakje) nog een wit stukje? Dat moet weg.
http://azdin.s2.one2xs.com/index.html
Zie je onder dat menu (onder contact vakje) nog een wit stukje? Dat moet weg.
height:100% veranderen in de hoogte van de kopjes.
en om de tekst in het midden te zetten: line-height:aantalpixels;
en om de tekst in het midden te zetten: line-height:aantalpixels;
Drakonfly schreef:[bla bla geknipt]<ul id="menu"> <li><a href="#" class="menu">home</a> <li><a href="#" class="menu">nieuws</a> <li><a href="#" class="menu">info</a> <li><a href="#" class="menu">blaat</a> </ul>
het is misschien ook handiger om alle
E; quotefix
