Twitter-bootstrap 3 창 크기를 조정할 때 사이드 바가 겹쳐진 내용과 바닥 글

Question

부트 스트랩 3에 접미사를 사용하고 창 크기를 조정할 때 겹쳐지는 사이드 바에 문제가 있습니다. 일부 CSS 클래스를 추가하여 열을 중첩하는 대신 상단에 메뉴가 붙는 방법이 있습니까?

또한 열이 바닥 글과 겹치고 있습니다. 어떤 도움이라도 대단히 감사하겠습니다. 많은 사람들이 똑같은 문제를 겪고있는 것 같습니다. CSS를 여기

<div class="container"> 
<div class="row"> 
    <div class="col-md-4 column"> 
       <ul id="sidebar" class="nav nav-stacked" data-spy="affix" data-offset-top="130"> 
       <li><a href="#software"><b>Software</b></a></li> 
        <ul> 
         <li><a href="#features">Features</a></li> 
         <li><a href="#benefits">Benefits</a></li> 
         <li><a href="#costs">Costs</a></li> 
        </ul> 

      </ul> 

    </div> 
    <div class="col-md-8 column"> 
      <p>blah, blah, blah</p> 
      <hr> 
      <a class="anchor3" id="top" name="software"></a> 
      <h2 style="font-weight:bold;">Software</h2> 
<p> 
blah, blah, blah...</p><br><br> 

    </div> 
    </div> 
    </div> 

됩니다 :

#sidebar.affix-top { 
position: static; 
} 

#sidebar.affix { 
position: fixed; 
top: 100px; 
} 

Answer 1

데모 : 화면 너비가 큰 경우 http://bootply.com/104634

당신 만 affix을 적용해야 여기

는 HTML입니다 992 픽셀 (부트 스트랩 col-md-*이 수직으로 스태킹을 시작하는 중단 점) . 또한

.affix-top,.affix{ 
    position: static; 
} 

@media (min-width: 992px) { 

    #sidebar.affix-top { 
    position: static; 
    } 

    #sidebar.affix { 
    position: fixed; 
    top: 100px; 
    } 
} 

, 당신은 당신이 col-sm-* 또는 col-xs-*에 열을 변경할 수 있습니다 작은 폭의 affix을 사용합니다.