【问题标题】:CSS Sub-menu positioning works in Chrome & Safari, but not IE and FirefoxCSS 子菜单定位在 Chrome 和 Safari 中有效,但在 IE 和 Firefox 中无效
【发布时间】:2013-04-02 01:45:18
【问题描述】:

我目前正在为游戏社区建立一个网站,名为http://www.quad-gaming.com/

除了导航栏右侧“登录”下的下拉菜单外,一切运行顺利。它在 Chrome 和 Safari 中运行良好,但在 IE 和 Firefox 中,它浮动到左侧。

我做错了什么?

【问题讨论】:

  • 请不要在指向网站的地方提出问题。网站发生了变化,但这个 stackoverflow 问题仍然存在。有人会想登陆一个他们看不到问题来源的页面吗?或者更糟糕的是:来源变了?它降低了stackoverflow的价值。编辑问题添加上面的相关代码,并提出关于CODE的问题,而不是引导观众“去看看网站”。

标签: html css menu navigation submenu


【解决方案1】:

我用过

nav ul li ul {
    position:absolute;
    left:0px; /* Adding this to fix left position*/
    visibility: hidden;
}    

它适用于 Firefox。

【讨论】:

  • 这解决了我的问题,但上面的答案更具体,所以我将其标记为已回答。有没有办法将您也添加到“已接受的答案”中?
  • 您可以将我的答案标记为有用...主要的想法是您已经解决了问题。
【解决方案2】:

确实有点奇怪。

如果您将ul 元素指定为将left 的值设为零,则可以正常工作:

nav ul li ul {
  left: 0;
}

无法在 IE 上试用,因为我在 Mac 上。希望它也能在那里工作。

【讨论】:

  • 再深入一点,我认为这正在发生,因为li 元素是一个内联元素,如果将其更改为浮动元素或内联块元素,它可以在没有添加left 值。我认为这种方式是一种更好的方式——即使你需要重新设计你的菜单——以避免进一步的冲突。
  • 添加“左:0;”解决了我的问题,非常感谢。这是我添加它的地方:nav ul li ul { position: absolute;左:0px;可见性:隐藏; }
【解决方案3】:

试试这个

.dropdown ul {
    left: 0;
}

在 IE10、IE8、FF20 和 Chrome 26 上测试并在 Win7 上运行

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-10-29
    • 1970-01-01
    • 1970-01-01
    • 2011-07-01
    • 1970-01-01
    • 1970-01-01
    • 2022-08-04
    • 1970-01-01
    相关资源
    最近更新 更多