Arial + Fet stil + Versaler + IE = osnyggt

MagnusJohansson · 2010-09-20, 21:02

Hej

Hur löser man det stora teckenavståndet som blir mellan Å och T på det snyggaste sättet? Håller på att bli tokig. I bifogad bild syns det hur det ser ut i IE8.

Kod:

<html>
<body>
<span style="font-family: Arial;font-size: 14px;font-weight:bold;">FRAMÅTANDA</span><br />
<span style="font-family: Arial;font-size: 14px;font-weight:bold;">FRAMATANDA</span>
</body>
</html>

Jonas · 2010-09-20, 22:02

Kod:

<span style="font-family: Arial;font-size: 14px;font-weight:bold;">FRAM<span style="letter-spacing: -1px">ÅT</span>ANDA</span><br />

MagnusJohansson · 2010-09-20, 23:04

Tack Jonas och tack för ditt svar. Jag önskar dock att det fanns en bättre mer generell lösning på det hela, någon?

För ditt "hack" måste för det första läggas i en egen separat IE.css då det annars ser fult ut i andra webbläsare eller OS och så måste jag avgöra om det bara ska inkluderas i upp till ie8 eller alla framtida versioner.

akelagercrantz · 2010-09-21, 09:49

Testa att leka med letter-spacing

MagnusJohansson · 2010-09-21, 11:45

Citat:

Ursprungligen postat av alager

Testa att leka med letter-spacing

Hej och tack alager, om du menar samma letter-spacing för hela ordet så har jag gjort det, visst om man sätter letter-spacing till väldigt mycket så lurar man ju ögat då mindre skillnader i teckenavstånd inte längre syns.

Jag är lite förvånad att ingen mer verkar känna igen sig i problemet, känns ju inte som ett edge case direkt.

Aktiva användare som för närvarande tittar på det här ämnet: 1 (0 medlemmar och 1 gäster)

Menu

Arial + Fet stil + Versaler + IE = osnyggt