Extra Platz mit Schriftwechsel

Ich versuche, eine Vorlage bereinigt und ich habe Probleme mit einem zusätzlichen Pixel hinzugefügt werden die Hover-Effekte und Header/Footer-Überlauf zu brechen.Extra Platz mit Schriftwechsel

Template link

Wie Sie sehen können, wenn schweben über einen der Links, unten sein ein Pixel verschoben. Alles Stylesheet-weise ist in ems, damit es reaktionsfähig ist. Wenn ich die Schriftgröße bei 1em halte, funktioniert alles gut, aber ich ändere es einfach in .75em, wie ich es dort habe, es bricht es ein bisschen.

CSS Direct Link

Update: Nicht sicher, ob es in Betracht gezogen hat „Hacky“ aber ich habe innerhalb jeder der Link Container Spanne ist so, dass ich die Schriftgröße des Verbindungsbehälters ohne Änderung der Zeilenhöhe verändern könnten. das scheint gut zu funktionieren

Quelle

2012-03-24 Colby

funktioniert nicht in Chrome passieren. – j08691

Hm, du hast Recht. Ich habe in FF eingecheckt, aber ich habe nur IE angesehen und es hat auch das Problem. – Colby

Versuchen, Zeilenhöhe hinzuzufügen oder zu entfernen Zeilenhöhe.

Zum Beispiel:

<div style="line-height:30px;">Div content</div>

Quelle

2012-03-24 21:14:41

Siehe auch http://www.w3.org/TR/WCAG20-TECHS/C21.html – dotoree

Ja, ich habe das an sich selbst und seinen Eltern ausprobiert. Problem ist, dass ich die Linienstärke benutze, um die Verbindung innerhalb des Containers vertikal zu zentrieren. – Colby

@Colby versuchen Polster dann vertikal auszurichten. füge Top-Bottom-Padding (sagen wir 10) hinzu und reduziere die Höhe um das Doppelte (hier 20) –

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#header').css('width', $("#header").width()); 
    }); 
</script> 
<li id="header"><a href="#">Header</a><li>

bleiben immer die gleiche Breite

Quelle

2012-03-24 21:27:17

Hm:/nicht sicher, die Breite ist das Problem hier – Colby

Antwort

Verwandte Themen