7 svar · 380 visningar · startad av maqe
Jag gör en meny mha en lista och jag skulle vilja ha en linje mellan varje element som är en punkt linje. Nu använder jag border-bottom:dotted 1px #000; men den blir aldeles för stor tycker jag. Hur gör jag en egen dotted line på bästa sätt?
Det kan bli svårt att få en linje tunnare än en pixel... Eller är den för stor på annat sätt?
Du kan ju rita en egen bild, två pixlar bred med en svart pixel i den högra pixeln och sen så lägger du den som bakgrund i <li>-objektet. Typ så här:
li {
background: url(listbild.gif) bottom left repeat-x;
}
Sådär tror jag man borde kunna göra. :) Men som pettson skriver så går det ju inte få en tunnare linje än 1pixel. ;)
känns inte som att dotted 1px blir 1px ... i FF blir bordern helt ok men inte i IE tyvärr. det med bakgrund är ju en lösning, dock använder jag background taggen för att byta ut punkten mot en egen ikon.
'dotted' stödjs ej av IE. Den blir 'dashed' istället.
2px dotted och tjockare ser rätt ut i IE.
maqe skrev:
... dock använder jag background taggen för att byta ut punkten mot en egen ikon.
Varför då? Det finns ju ett attribut, list-style-image, som används för att byta ut punkten.
jag tyckte det var enklare att placera ikonen om jag lade den som background.