0

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

我一直在与 bootstrap 合作，为我今年夏天的实习重新设计一个网页，并且在从我的老板那里得到了几个布局之后，我希望这是最后一个。我不得不放弃使用模板，因为覆盖他们将实现的一些预定义主题太难了，所以我或多或少地从头开始绘制这个布局。

我对带有“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 回答