取得できません：メニュー項目のテキストをインラインで表示するために

Question

私は単純に擬似セレクタを使用しています：トップレベルメニュー項目の横に>ドロップダウンインジケータをインラインで追加します。

はここで二つの例は、上に動作していない例を示すJSFiddleだし、それは以下の作業をすべきかストリップダウンバージョン：https://jsfiddle.net/z2rwe3wh/3/

HTMLは混乱のビットが、それはカスタムウォーカークラスから生成されていますですWordPressと各サブメニューには、プロジェクト内にカスタムネストされたレイアウトとスタイルがありますが、私のCSSには：after擬似セレクタが正しく動作し、テキストの右側に>マーカーをインラインに保つことができないものがあります。

これは両方のメニュー（JSFiddleの下部にあるCSSにあります）にマーカーを追加するために使用される擬似セレクターです。

nav ul li.master > a:after { 
    content: " >"; 
    width: 10px; 
    height: 5px; 
} 

シャーロックホームズの瞬間を気にしないなら、それは非常に感謝します - 私はそれを追跡することができませんでした。

Answer 1

<a>タグにdivがあるためです。 Divsはデフォルトでdisplay: block;ですので、:after要素を次の行にプッシュしています。

があなたのCSSに以下を追加します。作業の例で.name { display: inline; }

を、:afterおよびテキスト（いないdivが）ので、同じライン上に座っ<a>以内です。