CSS min width div nicht und zwingt Sie container auf die richtige Größe wie erwartet

Ich habe eine DIV, die eine minimale Breite. Ich kann nicht mit der CSS - min-width als nicht cross-browser. Ich habe eine innere div mit einer Breite festlegen. Wenn der browser kleiner ist als das innere div bekomme ich eine Bildlaufleiste angezeigt, wie erwartet.

Das Problem ist, dass der div outter immer geringer, der kleiner als der innere div.

Sehen hier für ein Beispiel.

Ich würde erwarten, dass die blau werden, die die gleiche Breite wie die gelben.

Was ist Los mit meinem CSS?

  • Da outer wraps inner es wird nicht notwendigerweise die gleiche Breite. Versuchen Sie das einwickeln outer mit einem anderen div, und dann die Einstellung outer width:100%
  • jsfiddle.net/jzaun/6e6yX/5 Das scheint nicht zu funktionieren. Ich bin nicht auf der Suche, um outter der gleiche wie der innere, der einfach nicht kleiner werden als die inneren div.
  • Ich meinte, dass müssten Sie geben Sie die Breite für die wrapper eher als inner. Einen Blick: jsfiddle.net/6e6yX/8
  • Dann kann nie grösser werden. Ich bin auf der Suche, um eine cross-browser-minimale Breite.
InformationsquelleAutor Justin808 | 2011-11-14
  1. 7

    min-width wird unterstützt von allen Browsern außer dem IE6. Wenn Sie nicht brauchen, IE6-Unterstützung, können Sie min-width wie normal.

    Wenn Sie tun müssen IE6-Unterstützung, IE6 passiert, zu behandeln width (und height) auf die gleiche Weise, dass andere Browser behandeln min-width (und min-height). Sie können einen hack zu fake-it:

    #outer {
    width: auto !important;
    width: 1000px;
    min-width: 1000px;
}

    IE6 wird die zweite width Eigenschaft (die es zu behandeln, wird als min-width), weil es fälschlicherweise ignoriert die !important auf dem ersten. Mit anderen Browsern wird die width zu auto und die min-width zu 1000px.

    Hoffentlich habe ich deine Frage verstanden richtig. Hier ist eine änderung Ihres ursprünglichen code mit diesem update: http://jsfiddle.net/6e6yX/6/. Tut dies, tun das, was Sie suchen?

    • warum ie6 ignorieren wichtig?
    InformationsquelleAutor daGUY
  2. 1

    Wenn Sie hinzufügen:

    float: left;

    Sowohl von Ihnen, Sie Verhalten sich, als Sie erwarten.

    http://jsfiddle.net/eVWKu/

    InformationsquelleAutor Jedediah
Schreibe einen Kommentar