IE8 Problem: div bricht Linie, obwohl es schwebte

Question

Dies sieht aus wie IE8 Problem. Ich habe zwei divs, die Seite an Seite liegen, weil ich eine von ihnen nach links schweben lasse. Wenn jedoch der Inhalt innerhalb des rechten div für das Fenster zu groß wird, bricht das rechte div die Zeile und geht unter left div. Wie stelle ich beide Divs nebeneinander auf gleicher Ebene? Hier

ist der Code:

css:

<style type="text/css"> 
    #left_div 
    { 
     float: left; 
     width: 250px; 
     height: 400px; 
     border: solid 1px red; 
    } 
    #right_div 
    { 
     width: 3000px; 
     border: solid 1px blue; 
    } 
</style> 

html:

<div id="left_div"> 
     text in left_div 
    </div> 
    <div id="right_div"> 
     text in right_div 
    </div> 

Answer 1

Add float: zum right_div als auch links.

Wenn es etwas Ähnliches zu den Beispielen ist, die durch Matthew James Taylor und sein Perfect 2 Column Left Menu gezeigt werden, werfen Sie einen Blick auf, wie er es tut und vielleicht kopiert es!

---

IE in der Vergangenheit hat sich auch das Problem, dass es Höhe nahm und Breite Höhe min und Breite min bedeuten, also noch erlauben Boxen eventhough, um die Größe sie bestimmte Grenzen gesetzt hatte. Siehe Webcredible's article, vor allem Nummer 2 auf ihrer Liste!

Answer 2

Sie können auch einen linken Rand von mindestens 250px (die Breite des left_div) zum right_div hinzufügen, so dass immer Platz für das left_div neben dem right_div ist.

Answer 3

Änderung der Doctype: (IE8 muss es richtig die Webseite machen)

< DOCTYPE html PUBLIC " - // W3C // DTD XHTML 1.0 Strict // EN " " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd " >
< html xmlns! = " http: // ww w.w3.org/1999/xhtml " xml: lang = " en-GB " >

(I URLs mit Leerzeichen bearbeitet, so vergessen Sie nicht remo ve sie :))