最小幅ポイント過去水平スクロールバー

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;

私はそれがあまりにも縮小することはできませんし、この最小幅ポイントを過ぎて、私は中央の列に重複右列の代わりに、水平スクロールバーを表示するには、ブラウザのようにしたいので、中央の列に最小幅を設定したいです。

Answer 1

あなたは、jQueryのスプリッタプラグインを試みることができます。それはCSSテンプレートが行うよりも、ブラウザの違いを抽象化のより良い仕事をしていませんので、私は列のレイアウトを必要とするとき、私が使用しているものだし、それは完璧にスクロールバーを処理します。

http://methvin.com/splitter/する

Answer 2

最小幅が完全にサポートされているCSSプロパティではありません。あなたの状況で、この周りの簡単な方法は、単にあなたの最小幅値に等しい幅を持つ列の一番下にあるdiv要素を追加することです。

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

この列はどんな小さなを縮小することはできなくなります。ホープことができます！