Bootstrap响应式布局问题 - 导航消失并且div重叠

时间:2013-07-19 03:11:43

标签: html css twitter-bootstrap responsive-design fluid-layout

我在我的投资组合网站上使用Twitter引导程序。流体布局似乎可以达到某一点,但主页存在一些问题。

  1. 一旦我小于约997px,导航菜单就会完全消失。它几乎看起来像是在标题栏下方掉落并隐藏起来,但我似乎无法让它显示出来。它实际上应切换到移动菜单并保留在右上角。

  2. 此外,当您进入较小的屏幕尺寸时,索引页面的“关于我”和“联系”部分会相互重叠。我确定这与我的结构有某种关系,但找不到问题。

  3. 任何引导专家都知道可能导致这些问题的原因是什么?

    以下是该网站测试版的链接。 http://theiamzone.com/kyle_hagler/portfolio-site

1 个答案:

答案 0 :(得分:0)

从我从网站查看的源代码, 我发现你缺少jquery文件。

  

<script src="//code.jquery.com/jquery-1.10.1.min.js">

点击它,看看下拉列表是否正常工作。

关于我们和联系我们部分。

您可以尝试的方法是将容器包装起来,请从此处阅读以获取更多信息。 http://twitter.github.io/bootstrap/scaffolding.html#layouts

从我在关于我们的部分的观点来看,尽量不要包装2跨6列, 请改用以下代码。

<div class="row-fluid">
    <div class="span12">
       <div class="span6"></div>
       <div class="span6"></div>
    </div>
</div>

同样的情况发生在联系我们部分, css类没有分配给他们工作。