Internet Explorer 6 CSS-Techniken

Es ist eine schwierige Aufgabe für Webentwickler ihre Websites mit der Fülle der verfügbaren Web-Browser vollständig kompatibel zu machen, und Internet Explorer 6 ist keine Ausnahme. Allgemein anerkannt als seiend eine veraltete und Normen-rückwärts Programm, Internet Explorer 6 dauert ein wenig zusätzlichen Aufwand, es funktioniert mit einer Website CSS erhalten.

Schriftgrads

Internet Explorer 6 ist ein wenig wählerisch, wenn es darum geht, Ändern der Größe von Text. Es wird keine Textgröße in Pixel festgelegt, und es übertreibt Textsatz in Em. Zum Ausgleich müssen Sie definieren Sie zuerst die Schriftgröße im Body-Element als Prozentsatz und dann Em durch den Rest des Ihr Stylesheet verwenden.

Der Körper-Code würde folgendermaßen aussehen:

Body {font-size: 75%}

Sobald Sie dies aufgerufen haben, kann ein anderes Element als Em festgelegt werden. Zum Beispiel:

h1 {font-size: 3em}

Beachten Sie, dass 75 % entspricht einer 12px festlegen, der Standardwert 16px dargestellt wird. Diese Einstellungen sollten Sie anständig Schriftart Ergebnisse mit Ihrer Website erhalten.

Doppel-Margen auf gefloatete Elemente

Eines der grundlegenden Elemente des Webdesigns ist "Divs" verwenden, Inhalt für einfachere Verwaltung der Elemente in Gruppen ausgerichtet. In bestimmten Szenarien empfiehlt es sich, zu "schweben" ein Div, das Ihnen erlaubt, ein Div neben einem anderen Div, nach links oder rechts zu verschieben. So bleibt kein Platz zwischen Divs, also ein Spielraum festgelegt werden muss, um sie zu trennen. Der Code wird wie folgt aussehen:

#left {float: right, width: 400px, margin-right: 10px} #right {float: right, width: 200px}

Moderne Browser werden wie Firefox und Safari dies richtig machen, wird beim Internet Explorer doppelt am Rand. Warum genau es tut dies ist unbekannt, aber es ist ziemlich frustrierend als Designer. Um dies zu beheben, müssen Sie den "Inline"-Aufruf hinzufügen.

#left {float: right, width: 400px, margin-right: 10px, display: inline} #right {float: right, width: 200px, display: inline}

Dies wird das Doppel-Marge-Problem zu beheben und andere Browser unberührt lassen.

Ausbau von Divs

Wie im obigen Beispiel haben Sie zwei Divs nebeneinander, schwebte, ist es üblich, eine Breite festlegen für die Divs haben. Internet Explorer 6 wird das Layout brechen, wenn der Text darin deklarierte Breite Beuget. Hier ist der Code unveränderte.

#left {float: right, width: 400px,} #right {float: right, width: 200px,}

Dies wird korrekt dargestellt, aber wenn es zu viel innerhalb der #left Div gibt, das #right Div wird nicht ordnungsgemäß gerendert. Um zu beheben, verwenden Sie den "Überlauf"-Aufruf.

#left {float: right, width: 400px, overflow: hidden} #right {float: right, width: 200px, overflow: hidden}

Dadurch wird den überfließenden Text, ermöglicht das #right Div richtig positioniert bleiben ausgeblendet. Bitte beachten Sie jedoch, dass es nicht den Text nicht zwingen, aber es die Ausrichtung erspart.