Salve, sto sviluppando un menù orizzontale fatto di soli link testuali, centrati in blocco orizzontalmente in un div.
Su Firefox/Chrome (ultime versioni attuali) l'allineamento verticale è ok, cioè gradevole, nel senso che si vede un equo spazio sopra e sotto i link. Su Chrome mi pare che il testo sia uno o forse due pixel (non ho misurato) più in alto, ma resta comunque ok e gradevole.
Il problema è che su Internet Explorer 11 invece il testo viene spostato più in alto rispetto agli altri due browser e il risultato è decisamente poco gradevole. Se in IE seleziono il testo, si vede nella selezione che effettivamente c'è molto più spazio sotto rispetto a sopra.
Potete provare quanto ho detto con il codice HTML completo che riporto qui sotto. Richiede solo il font Fira Sans da Google Fonts.
codice:<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <link href='http://fonts.googleapis.com/css?family=Fira+Sans:300' rel='stylesheet' type='text/css'> <title>Test</title> <style type="text/css"> body { font-family: 'Fira Sans', sans-serif; font-weight: 300; } #menu { width: 960px; color: #707070; background: black; text-align: center; padding-top: 12px; padding-bottom: 12px; } #menu a { font-size: 18px; color: #D0D0D0; outline: none; text-decoration: none; padding-left: 12px; padding-right: 12px; } #menu a:hover { color: white; } </style> </head> <body> <div id="menu"><a href="/home.html">HOME</a>|<a href="/about.html">ABOUT</a>|<a href="/contacts.html">CONTACTS</a></div> </body> </html>
Alla fin fine non mi interessa tanto se il div risulta poi con altezza 42 .. 43 .. 44. ecc... pixel ma che i link risultino "gradevolmente" centrati verticalmente.
Domande: il problema è fissabile su IE? (ho già provato a smanettare un po' tramite CSS ....). Come verrebbe su altri browser? (non ne ho altri al momento). Ma soprattutto: pensate che sono andato a cercarmi "grane" su questo fronte?
Grazie in anticipo per qualunque consiglio/critica.


Rispondi quotando