html - 使用 Bootstrap CSS 进行响应式网页设计

Question

我已经建立了一个网站，我正在尝试使其响应...使用 Bootstrap CSS 实际上相当容易 - 但我遇到了一个奇怪的问题。一切正常......除了当我访问一个页面(“设置”页面)时，当我将我的 iPhone 直立时......链接在导航栏中停止工作(我尝试点击它们但没有任何反应)。但是，如果我转动我的 iPhone 并将其水平握住，导航栏链接将再次开始工作。有没有人见过这个问题？这是相关代码:

navbar.html(我使用的是 angular，导航按钮在一个页面上运行是没有意义的......而不是在另一个页面上运行):

<div class="header" ng-controller="NavbarCtrl">
  <h2 id="redbox" class="text-muted">[H]</h2><h3 class="text-muted">ackabox</h3>
  <ul class="nav nav-pills pull-right">
    <li ng-repeat="item in menu" ng-class="{active: isActive(item.link)}">
        <a ng-href="{{item.link}}">{{item.title}}</a>
    </li>
    <li ng-hide="currentUser" ng-class="{active: isActive('/login')}"><a href="/login">Login</a></li>
    <li ng-show="currentUser" ng-class="{active: isActive('/settings')}"><a href="/settings">Settings</a></li>
    <li ng-hide="currentUser" ng-class="{active: isActive('/signup')}"><a href="/signup">Sign up</a></li>
    <li ng-show="currentUser" ng-class="{active: isActive('/logout')}"><a href="" ng-click="logout()">Logout</a></li>
  </ul>
</div>

我真的不知道代码还应该包括什么……这似乎是响应式网页设计的一个小故障，可能有一些我不知道的奇怪解决方案。任何帮助将不胜感激。

更新

我将站点发布到 git:https://github.com/eamonwhiter73/hackabox

包含节点模块...您只需运行 MongoDB 实例...然后 cd 到控制台中的站点目录...并键入 grunt serve。这会将站点自动加载到 localhost:9000 上的浏览​​器中。

此外，为了使 MongoDB 正常运行 - 请注意 lib/config/env/development.js 中的这一行:

...

uri: 'mongodb://localhost/hackabox'

...

您可能需要根据您在计算机上设置 MongoDB 的方式来更改此设置(我在 Mac 上，但我知道对于 Windows，语法可能略有不同 - 或者您可能使用用户名和密码...只需用谷歌搜索即可)。

尝试一下(并查看我在网站中构建的酷论坛)!

Answer 1

找到真正的罪魁祸首 - 奇怪的是 - 它只是 .header > h2 和 的 css 中的 float:left >.header > h3 - 当我删除它时它修复了一切 - 需要找出一种不同的方式来重新格式化我的标题:)