0

私はこのようなことをしたい:

http://twitter.github.io/bootstrap/components.html

ナビゲーションバー、「ジャンボトロン」があり、ナビゲーションリストが左側にあります。ジャンボトロンの下にありますが、下にスクロールすると、ナビゲーションバーに当たるまでスクロールし、それから一緒に下にスクロールします.

これまでのところ、ページとともにスクロールダウンしますが、上部の余白はnavbar + jumbotronであるため、スクロールダウンすると大量の空白ができます. ソースコードに答えが見つからないようです。

左のナビゲーション リストの位置を修正し、コンテンツを右の float:left に左マージンを付けてフローティングすることで、これを行いました。

ご協力いただきありがとうございます。

<!-- start page wrap -->
<div id="wrap">

<!-- START NAV -->

<div class ="navbar navbar-inverse navbar-fixed-top">
    <div class="navinner">
    <div class="container">
        <ul class="nav pull-right helfont">
          <li><!-- TOP NAV BAR LIST HERE -->
        </ul>
    </div> 
  </div> 
</div> 



<!-- END NAV -->  


<div id="faq" class="container">

<div class="title">
    <h1> Frequently Asked Questions </h1>
</div>  

<div class="row">
     <div class="span3 offset1 faq-list">
      <ul class="nav nav-list" style="padding-left: 20px;">
      <li> <!-- NAV LIST HERE THAT I WANT ON LEFT -->
      </ul>
   </div>
 </div>

<div class="span7 offset3 faq-content">
  <!-- CONTENT ON RIGHT HERE -->
</div>

CSS:

 #faq {
 margin-top: 30px;
}

#faq .row {
margin-top: 40px;
 }

.faq-list {
position: fixed;
}

.faq-content {
 margin-left: 320px !important;
 float:left;
}
4

1 に答える 1