0

BootStrap3 CSS navbar を使用しています。私の jsfiddle デモでは、Chrome と FF&IE の間で問題なく動作しますが、サイトでは、FF&IE にはメニューの下に巨大なバー/空白スペースがあります。FF要素インスペクターを使用しても問題が見つからないようです。テーマ スタイルを無効にすると、一部は修正されますが、それでもサイズが大きいため、競合が発生する可能性があります。考えられるほとんどすべてを無効にしましたが、競合や何が間違っているのかまだわかりません。

JSフィドルとウェブサイト

<div class="navbar navbar-default navbar-inverse" role="navigation">
    <div class="navbar-header"> <a class="navbar-brand" href="#"> Year </a>
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#year-navs"> <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
    </div>
    <div class="collapse navbar-collapse" id="year-navs">
        <ul class="nav navbar-nav">
            <li><a href="/football/colorado/team/mountain_range/2007/">2007</a>
            </li>
            <li><a href="/football/colorado/team/mountain_range/2008/">2008</a>
            </li>
            <li><a href="/football/colorado/team/mountain_range/2009/">2009</a>
            </li>
            <li><a href="/football/colorado/team/mountain_range/2010/">2010</a>
            </li>
            <li><a href="/football/colorado/team/mountain_range/2011/">2011</a>
            </li>
            <li><a href="/football/colorado/team/mountain_range/2012/">2012</a>
            </li>
            <li class="active"><a href="/football/colorado/team/mountain_range/2013/">2013</a>
            </li>
        </ul>
    </div>
</div>

FFで本当に大きい

高さは 52 ピクセル (またはその程度) にする必要があります。

私は何を間違っていますか？競合する CSS はどこにありますか? Bootstrap CSS を正しく使用/インストールしていませんか?

4

2 に答える 2

1

これを理解するのにしばらく時間がかかりましたが、それは痛ましいほど明白でした:

サイドバーが左に浮いています。はnavbarフロートをクリアしているため、フロートがすべて適切に含まれています (その中のすべての nav 要素がフロートされています) が、フロート要素内にないため、周囲のすべてのフロートがクリアされています。

がそのコンテナーの外側にあるフロートをクリアしようとしないように、コンテナー要素に追加float: left(または)する必要があります。float: rightnavbar

<div style="margin: 0 0 0 170px;">関連するコンテナと思われるコードが含まれています。

代わりに、負の左マージン、補正する左パディング、および 100% 幅を試してください。

<div style="margin: 0 0 0 -170px; float: right; padding-left: 170px; width: 100%;">

おそらくそれをスタイルシートに移動する必要がありますが、それを知っているに違いありません。

于 2013-11-11T05:47:28.973 に答える
0

この分野での経験はあまりありませんが、解決策があるかもしれません。制約 height: 52px; を追加するだけです。css の .navbar クラスに。

于 2013-11-11T04:45:59.723 に答える