Html 导航工具提示错误的位置

Html 导航工具提示错误的位置,html,css,wordpress,navigation,tooltip,Html,Css,Wordpress,Navigation,Tooltip,我为此导航创建了工具提示箭头。它们显示在悬停状态,但也显示在下拉列表的底部。我想知道是什么代码让他们留在那里 下面是我用来实现它们的代码 您需要针对箭头所针对的UL具有更大的特异性。ul.flyout在给定当前选择器的情况下使用箭头设置样式 这可能会更好: #menu-header-nav > li:hover:after { content: ''; display: block; width: 0; height: 0; position: absolute; left: 50%;

我为此导航创建了工具提示箭头。它们显示在悬停状态,但也显示在下拉列表的底部。我想知道是什么代码让他们留在那里

下面是我用来实现它们的代码


您需要针对箭头所针对的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;
}

您使用的浏览器是什么?请尝试
.cftopnavrightlower>ul li:hover:after
#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;
}