7
Modifica: Ecco uno Fiddle della situazione.Come posso ottenere questo testo per sedersi completamente a sinistra?
Ok, quindi sto costruendo una pagina Web, ma mi sto imbattendo in un capriccio di carattere irritante. Sembra che i font sans-serif si rifiutano di sedersi proprio sul bordo sinistro della scatola sono seduti in
Ecco alcuni HTML sperimentale per dimostrare il problema:.
<html>
<head>
<style>
.box {
margin: 30px 0px 0px 30px;
border: 1px solid #f00;
}
</style>
</head>
<body style="font-size: 36px;">
<!-- text beginning with 'M', which has serifs protruding from the left side in a serif font -->
<div class="box" style="font-family: 'Segoe UI';">My text</div> <!-- sans-serif -->
<div class="box" style="font-family: 'Times New Roman';">My text</div> <!-- serif -->
<div class="box" style="font-family: 'Arial';">My text</div> <!-- sans-serif -->
<div class="box" style="font-family: 'Garamond';">My text</div> <!-- serif -->
<!-- text beginning with 'T', which has no left-protruding serifs in a serif font -->
<div class="box" style="font-family: 'Segoe UI';">Text</div> <!-- sans-serif -->
<div class="box" style="font-family: 'Times New Roman';">Text</div> <!-- serif -->
<div class="box" style="font-family: 'Arial';">Text</div> <!-- sans-serif -->
<div class="box" style="font-family: 'Garamond';">Text</div> <!-- serif -->
</body>
</html>
Tutte le idee su attributi CSS I può impostare/modificare per ottenere il testo di sedersi sul bordo sinistro del suo contenitore? In modo elegante, cioè, non mi piacerebbe davvero una soluzione carattere per carattere.
Provare il rientro del testo? –
Questo è un problema specifico del browser e/o del sistema operativo, perché non riesco a riprodurlo sul mio Mac utilizzando Chrome. Fornisci uno screenshot? Vorrei comunque provare qualcosa come text-indent: -1px; –
Lo riproduco correttamente con "Google Chrome" e "Internet Explorer 8". Credo che abbia qualcosa a che fare con il rendering dei font, e sono molto curioso di sapere perché. – Peter