我的网站的导航栏在 PC 和移动设备上的显示出现问题

Question

我的编码技能有限，并使用WordPress，一个名为Ocean WP的预建主题和Elementor插件为自己建立了一个投资组合网站。我之前面临的问题是我的导航菜单有一个箭头来指示我的一个页面上的下拉菜单。

我真的不喜欢这个外观，所以我联系了Wordpress支持寻求帮助，并得到了这个CSS代码来输入：

/* eliminate dropdown arrow */
.elementor-navigation .menu-item-has-children > a:after {
display:none;
}

虽然代码可以删除箭头，但它给我的导航菜单留下了不均匀的空间。此外，我不确定如何使此代码在平板电脑/移动设备上工作，因为箭头仍然显示。

Answer 1

您隐藏了箭头，但没有隐藏它的额外间距。 这是没有空格和箭头的css：

.elementor-navigation .eldropdown-toggle {
display: none;
}
.elementor-navigation .menu-item-has-children > a {
margin-right: 0;
}
@media screen and (min-width: 56.875em)
.elementor-navigation .menu-item-has-children > a {
padding-right: 1em;
}
}

不过，我建议您保留下拉箭头。