【问题标题】:Moving a drop down navigation移动下拉导航
【发布时间】:2017-07-24 15:10:41
【问题描述】:

我在尝试使下拉导航居中时遇到了一些困难。

我在下面发布了当前设计的图片和一些 CSS。

如您所见,下拉列表不适合页面。

.structure-mainnavigation ul li ul {
width:500px;
}
.structure-mainnavigation ul li ul li {
width:25%;
float:left;
text-align: center;
}

感谢任何帮助。

【问题讨论】:

  • 寻求代码帮助的问题必须包含重现它所需的最短代码在问题本身中最好在Stack Snippet 中。见How to create a Minimal, Complete, and Verifiable example
  • 所以主菜单或子菜单没有居中?因为在我看来主菜单没有居中:)
  • 添加一些 CSS 很棒,但如果您有一些 HTML 和可能更多的 CSS 会更有帮助。这是最小的,但不是完整的或可验证的(请参阅minimal reproducible example)。在目前的状态下,人们很难给出有意义的答案。
  • @lumio 主体完美居中,这正是图片被裁剪的方式。

标签: css drop-down-menu navigation dropdown


【解决方案1】:

在搞砸了几个小时后,我通过添加以下代码解决了我自己的问题:

li:hover ul { left:auto; right:0; }

【讨论】:

  • 您是否在其他地方之前设置了left?尝试使用像 li:hover > ul 这样的直接选择器,这样只会选择一层中的 ul,而不是一直选择树
【解决方案2】:

你可以试试:

位置:绝对; 边距:0 自动;

当您说居中时,您的意思是将下拉菜单放在页面中心或菜单项中心?

【讨论】:

  • 我的意思是在类别下方居中,因此它将是“按类型礼品”的中心
猜你喜欢
  • 1970-01-01
  • 2013-05-16
  • 1970-01-01
  • 2012-10-24
  • 2019-05-14
  • 1970-01-01
  • 2017-08-03
  • 2021-05-21
  • 2021-08-08
相关资源
最近更新 更多