0
FontAwesomeのアイコン "caret-right"をメニューの3つのli/aタグに適用して、サブメニューの存在を示しました。アイコンは右寄せでなければならない。私のコードはChromeとEdgeでは動作しますが、Firefoxでは動作しません。 CDNを介してFAファイルを読み込む際に起こりうる問題を読んで、ウェブスペースから読み込むことに成功しました。メニュー項目の最後にアイコンが表示されますが、それらは切り取られてプッシュダウンされます。 はここに私のHTMLとCSSです：フォントAwesome IconはFirefoxで正しく整列しません
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" media="all" href="../css/reset.css" />
<link rel="stylesheet" type="text/css" media="all" href="../css/960.css" />
<link rel="stylesheet" href="../font-awesome/css/font-awesome.min.css">
<title>Titel</title>
<style type="text/css">
body, select, input, textarea, button {
\t font-family: 'Trebuchet MS',Verdana,Helvetica,Arial,sans-serif;
\t font-size: 13px;
\t line-height: 1.5em;
}
nav ul {
list-style: none;
margin: 0;
padding: 0;
}
nav > ul > li {
float: left;
}
nav > ul > li > ul {
display: none;
}
nav > ul a {
display: block;
white-space: nowrap;
padding: 10px;
background: #444;
color: #fff;
text-decoration: none;
}
nav > ul > li > a:after {
\t content: "\f0d7";
\t font-family: 'FontAwesome';
padding-left: 0.35em
}
nav > ul li > a:only-child:after {
content: "";
}
nav > ul > li:hover > ul {
display: block;
position: absolute;
}
nav > ul > li > ul > li {
position: relative;
}
nav > ul > li > ul > li > a:after {
\t float: right;
content: "\f0da";
\t font-family: 'FontAwesome';
padding-left: 1em
}
nav > ul li > a:only-child:after {
content: "";
}
nav > ul > li > ul > li > ul {
display: none;
}
nav > ul > li > ul > li:hover > ul {
display: block;
position: absolute;
left: 100%;
top: 0;
}
</style>
</head>
<body>
\t <nav>
\t \t <ul class="grid_12">
\t \t \t <li><a href="#">Home</a></li>
\t \t \t <li><a href="./mitglieder/mitglieder.php">Mitglieder</a></li>
\t \t \t <li><a href="#">Clubturniere</a>
\t \t \t \t <ul>
\t \t \t \t \t <li><a href="./cm/cm.php">Clubmeisterschaft</a></li>
\t \t \t \t \t <li><a href="./mobl/mobl_gw.php">Monats-Blitzturniere</a></li>
\t \t \t \t </ul>
\t \t \t </li>
\t \t \t <li><a href="./mannschaft/mannschaften.php">Mannschaften</a>
<ul>
<li><a href="#">Bayerische Meisterschaft</a>
<ul>
<li><a href="./mannschaft/m1.php">1. Mannschaft</a></li>
<li><a href="./mannschaft/m2.php">2. Mannschaft</a></li>
</ul>
</li>
<li><a href="#">Münchner Meisterschaft</a>
<ul>
<li><a href="./mannschaft/m3.php">3. Mannschaft</a></li>
<li><a href="./mannschaft/m4.php">4. Mannschaft</a></li>
<li><a href="./mannschaft/m5.php">5. Mannschaft</a></li>
<li><a href="./mannschaft/m6.php">6. Mannschaft</a></li>
<li><a href="./mannschaft/m7.php">7. Mannschaft</a></li>
</ul>
</li>
<li><a href="#">Senioren</a>
<ul>
<li><a href="./mannschaft/sen_m1.php">Senioren 1</a></li>
<li><a href="./mannschaft/sen_m2.php">Senioren 2</a></li>
</ul>
</li>
</ul>
\t \t \t </li>
\t \t \t <li><a href="./termine/termine.php">Termine</a></li>
\t \t \t <li><a href="#">Schachaufgaben</a>
<ul>
<li><a href="./aufgaben/schachaufgaben_1.php">Nummer 1 – 18</a></li>
<li><a href="./aufgaben/schachaufgaben_2.php">Nummer 19 – 36</a></li>
</ul>
</li>
\t \t \t <li><a href="./archiv/archiv.php">Archiv</a></li>
\t \t \t <li><a href="./kontakt/kontakt.php">Kontakt</a></li>
\t \t </ul>
\t </nav>
</body>
</html>ファイルへのリンクがhttp://msc1836.bplaced.net/menutest.html OSが勝利-10、Firefoxのバージョンは50.1.0ですです。
誰でも手伝いできますか？ Thxを、マイク
'nav-ul a'から' white-space：nowrap; 'を削除します –