0

http://pytools.webfactional.com/learn/bomar4/

私はこの夏のインターンシップのためにウェブページを再設計するためにブートストラップを使用しており、上司からいくつかのレイアウトを受け取った後、これが最後のものになることを願っています. テンプレートが実装する事前定義されたテーマの一部を上書きするのが難しすぎたため、テンプレートの使用を破棄する必要があったため、多かれ少なかれこのレイアウトを最初から作成しました。

「mainContent」クラスの div と「sideFooter」クラスの div のフロートに問題があります。F/S ビューでは、ハイライト テーブルはメインのサイドバー ナビゲーションの下に平らに表示されるはずですが、パネル ボックスの高さに等しい隙間があり、その理由がわかりません..幅 < 768 px のように、小さなウィンドウのサイズ変更で下部に移動するサイドバーのフロートをコンテンツの右に設定し、フロート: 左に設定することに関して、ここで他の質問に従いました

また、特定のブレークポイントではかなりずさんに見えます。サイズ変更時に一番下のフッターが左側に固定されず、サイドバーの残りの部分を超えて拡大し、モバイルサイズに達する前にコンテンツの下をさらに小さく移動しますが、これは許容できるように見えます...

どんな助けでも大歓迎です！

4

1 に答える 1

0

サイドバー用とメイン コンテンツ用の 2 つのコンテナ div を作成することもできます。例えば

<div class="row">
     <div class="col col-lg-3 col-sm-3">
         <!--All sidebar content Here --> 
     </div>
     <div class="col col-lg-9 col-sm-9">
         <!--All Main Content Here -->
     </div>
</div>

サイドバーの特定のものをメイン コンテンツの特定のアイテムと並べたい場合は、代わりに並べる必要のあるものを一緒に配置します。例えば：

<div class="row">
     <div class="col col-lg-3 col-sm-3">
         <!--Aligning sidebar content Here --> 
     </div>
     <div class="col col-lg-9 col-sm-9">
         <!--Aligning Main Content Here -->
     </div>
</div>    
<div class="row">
     <div class="col col-lg-3 col-sm-3">
         <!--Aligning sidebar content Here --> 
     </div>
     <div class="col col-lg-9 col-sm-9">
         <!--Aligning Main Content Here -->
     </div>
</div>
于 2013-08-02T17:35:52.043 に答える