【问题标题】:Dropdown menu of Vertical menu not working properly with margin垂直菜单的下拉菜单无法正常使用边距
【发布时间】:2013-03-01 01:47:17
【问题描述】:

各位专家兄弟/姐妹,

我正在使用一个网站,但遇到了下拉菜单问题。网站上有两个下拉菜单。一种是水平下拉菜单,另一种是垂直下拉菜单。我已经成功放置了两个下拉菜单。 请先看那个图片:

  1. 水平菜单的下拉菜单(父“购物车”)
  2. 垂直菜单的下拉菜单(父“杂志”)

我遇到了第二个问题(垂直菜单的下拉菜单): 下拉菜单属于“杂志”选项卡。您可能会看到主导航/选项卡和下拉导航之间有一个边距。我的问题是那个边距。我必须使用那个余量。但是,为了创建该页边距,我无法轻松地将鼠标放在“杂志导航”的下拉菜单中

您可以查看link。 看,从“购物车”菜单到它的下拉菜单也有一个边距(图 1)。但是,可以轻松地将鼠标放在“购物车”的下拉菜单上。但是,您不能在“杂志”菜单的下拉菜单中轻松选择/放置鼠标。

虽然从“购物车”菜单到它的下拉菜单也有一个边距,但它没有造成问题。因为,我给“购物车”li 赋予了高度,这在睁开的眼里看起来很边缘。因此,从“购物车”菜单到它的下拉菜单没有实际的边距(marin-top)。但是,我不能对“杂志”菜单使用相同的技术,我的意思是我不能为“杂志”菜单使用更大的宽度来作为其下拉菜单的抽象边距。因为,如果我使用更大的宽度而不是边距,“杂志”菜单中也会出现背景颜色和图像。

那么,你能帮帮我吗?我可以向您说明我的问题吗?简而言之,我想告诉你我不能轻易地将鼠标从“杂志”菜单放到它的下拉菜单中,因为从“杂志”菜单到它的下拉菜单的左侧创建了一个边距.

感谢大家阅读我的问题。

(我已尝试在此处提供该菜单的代码。但是,我无法在此处进行格式化。这就是为什么,如果有人需要,我已将其上传:Download

【问题讨论】:

  • 毫无疑问,您应该增加右边距并控制内容。您可以使用 left-col 及其内容 UL 和 LI 以继续悬停。似乎 20 像素的 margi-right 就可以了
  • 我不清楚您的解决方案。是的,从“杂志”菜单到它的下拉菜单大约有 15 像素的边距。我已经从 Andy Allcorn 那里得到了一个简单的解决方案。感谢您的评论。

标签: css drop-down-menu web web-site-project


【解决方案1】:

嗯,这是一个糟糕的 hack,但你可以像这样伪造页边距:

.vertical_nav li ul li {
  border-left: 15px solid #fff;
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-05-01
    • 2017-12-01
    • 2015-01-27
    • 2020-10-27
    相关资源
    最近更新 更多