Jag har råkat ut för ett konstigt CSS-problem. Jag försöker göra en meny men paddingen ser ut att vara 1em fastän jag skriver 1px. Det är väldigt lite kod ändå så kan jag inte se vad felet är. Vet någon vad felet kan vara?
<html>
<head>
<title>Test sida</title>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<div id="navibar">
<ul>
<li><a href="aaa.html"> Home</a> </li>
<li>|</li>
<li><a href="bbb.html">Guestbook</a> </li>
<li>|</li>
<li><a href="ccc.html">Javascript Games</a> </li>
</ul>
</div>
</body>
</html>
#navibar a
{
color: white;
}
#navibar
{
background: blue;
color: white;
padding: 1px;
}
#navibar li
{
display: inline;
}
icaaqMedlem sedan okt. 20005 273 inlägg Du har satt egenskaperna på div#navibar istället för på ul inom #navibar. Antingen så ändrar du i css:en så att det blir såh är:
#navibar ul
{
background: blue;
color: white;
padding: 1px;
}
eller så ändrar du i html:n och tar bort den onödiga diven, vilket är en snyggare/cleanare lösning
<ul id="navibar">
<li><a href="aaa.html"> Home</a> </li>
<li>|</li>
<li><a href="bbb.html">Guestbook</a> </li>
<li>|</li>
<li><a href="ccc.html">Javascript Games</a> </li>
</ul>
mv icaaq
...
Tack för svaret, men jag kan fortfarande inte förstå varför det inte fungerar lika bra med padding på div som på ul..
Danne VMedlem sedan aug. 20068 090 inlägg
olarsson skrev:
Tack för svaret, men jag kan fortfarande inte förstå varför det inte lika bra dungerar med padding på div som på ul..
Gissning:
För att du inte hade <ul> formaterad alls. Då slänger webbläsaren in sin förutbestämda formatering istället. Den kan variera mellan olika webbläsare men för <ul> innehåller den ganska säkert en default-padding på 4-10 px som du alltså såg (det var väl det som blev fel, va?).
Men för <div> finns det knappast någon default-padding alls. Så genom att ta padding på <ul> så fick du bort dess default-padding, och divven har ju ingen alls från början.
Tips: Jag brukar starta stilmallar direkt med att "nolla" alla paddings och margins:
* {padding:0; margin:0}
Sedan lägger jag dit dom igen där jag vill ha dom. På så sätt får man bättre kontroll och slipper tråkiga överraskningar.