5 svar · 284 visningar · startad av Tjock-Erik
Jag har upptäckt att länkunderstrykningen hamnar två pixlar längre ner under texten i Firefox med bara en pixel under i IE och Opera. Finns det något sätt att undvika detta? När jag besöker andra sidor har jag inte sätt detta problem.
A:link { color: red; text-decoration: none; }
A:visited { color: blue; text-decoration: none; }
A:hover { color: yellow; text-decoration: none; }
A:active { color: lime; text-decoration: none; }
Hur menar du? Det där gör ju att länkunderstrykningen försvinner. Mitt problem är att den sjunker ner en pixel i Firefox jämfört med alla andra webbläsare jag har testart.
För mig ser det likadant ut i Opera och Firefox, men i IE är understryckningen närmare texten.
Antingen låter du det vara eller så använder du border-bottom:.05em solid istället. (Dock verkar det vara en bugg med IE att den inte visar bordern om man har för lite i line-height. Det verkar som att 1.4 och högre funkar bra men det kanske varierar beroende på teckensnitt och storlek osv.)
Det jag menar är att du inte kan göra något åt det, det är inte något som styrs av någon utvändig kod, du kan testa med olika textstorlekar för att se om "problemet" försvinner, det är helt enkelt så olika webläsare inte behandlar allt identiskt.(tyvärr)
Så om zcorpans förslag inte fungerar, glöm det.
Nja, man kan väl göra så här!
<html>
<head>
<style type="text/css">
A {color:blue; text-decoration: none;}
A:hover{color:black; border-bottom:1px solid white; padding:0px;}
A:active {border-bottom:1px solid blue; padding:0px;}
</style>
</head>
<body bgcolor=green>
<a href=sidan1.htm> Sida ett </a>
<br><br>
<a href=sidan2.htm> Sida två </a>
<br><br>
<a href=sidan2.htm> Sida tre </a>
</body>
</html>