최소 폭을 지나서 수평 스크롤 바

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

Min-Width는 완전히 지원되는 CSS 속성이 아닙니다. 상황 에서이 주변의 쉬운 방법은 최소 너비 값과 동일한 폭을 갖는 열의 하단에 DIV를 추가하는 것입니다.

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

이로 인해 열이 더 작은 수축 할 수 없습니다. 도움이되기를 바랍니다!