html - ナビゲーションツールチップ間違った場所

Question

このナビゲーション用のツールチップ矢印を作成しました。それらはホバー時に表示されますが、ドロップダウンの下部にも表示されます。どんなコードがそれらをそこに保持しているのだろうか！

これが私がそれらを実装するために使用しているコードです。

開発サイトへのリンク

.cftopnavrightlower ul > li:hover:after {
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
left: 50%;
bottom: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #FFC700;
margin-left: -10px;
}

Answer 1

矢印をターゲットにしている UL について、より具体的にする必要があります。ul.flyout は、現在のセレクターを指定して矢印でスタイル設定されています。

これはうまくいくかもしれません：

#menu-header-nav > li:hover:after {
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
left: 50%;
bottom: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #FFC700;
margin-left: -10px;
}