Horizontale Scrollbar über die min-width Punkt

Question

HTML:

<div id="mcolWrapper">
    <div id="mcol">
      <div class="wrapper">
      content
      </div>
    </div>
</div>

<div id="lcol">
    <div class="wrapper">
    content
    </div>
</div>

<div id="rcol">
    <div class="wrapper">
    content
    </div>
</div>

CSS:

#mcolWrapper {
    float: left;
    width: 100%; }

#mcol { margin: 0 295px 0 235px; min-width: 500px; }

#lcol {
    float: left;
    width: 235px;
    margin-left: -100%; }

#rcol {
    float: left;
    width: 290px;
    margin-left: -295px;

Ich möchte eine Mindestbreite auf der mittleren Spalte setzen, damit es nicht zu viel schrumpfen kann und Vergangenheit dieser Mindestbreite Punkt, würde ich den Browser wie eine horizontale Bildlaufleiste angezeigt werden statt der rechten Spalte die mittlere Spalte überlappen.

Answer 1

Sie könnten das jQuery-Plugin-Splitter versuchen. Es ist, was ich benutze, wenn ich ein Spaltenlayout benötigen, weil es den Browser-Unterschiede als CSS-Vorlagen tun, einen besseren Job zu abstrahieren weg tut und es übernimmt die Bildlaufleisten einwandfrei.

http://methvin.com/splitter/

Answer 2

min-width ist keine vollständige CSS-Eigenschaft unterstützt. Ein einfacher Weg, um diese in Ihrer Situation einfach sein würde, um einen div am unteren Rande der Spalte hinzufügen, die eine Breite gleich Ihre minimale Breite Wert hat.

<div id="mcol">
  ...
  <div style="width:500px;"></div>
</div>

Dies bewirkt, dass die Spalte nicht in der Lage sein, jeden kleiner zu schrumpfen. Ich hoffe, das hilft!