对齐下拉菜单 - 左答案

【问题标题】：Align drop down menu - left对齐下拉菜单 - 左
【发布时间】：2014-03-31 11:46:28
【问题描述】：

当我将鼠标悬停在水平导航菜单上的页面名称上时，相关子页面会浮在下方。

目前这些显示居中，我如何对齐它们以使它们左对齐（与导航菜单标题名称一致）。

你可以去看看这个

http://79.170.44.145/sweetfe2.co.uk/

将鼠标悬停在“商业服务”上，看到下拉菜单了吗？我希望它向左对齐，这样页面链接（例如“Practice Studios Oxford”）的两个句子都会在“商业服务”下方直接向左浮动。

非常感谢，

山姆

【问题讨论】：

标签： html css menu

【解决方案1】：

使用 'text-align:leftto.sub-menu` 将文本左对齐

.sub-menu{
  text-align:left;
  width: 176px;
}

添加margin-left使子菜单与主菜单项对齐

.menu > li > ul{
  margin-left:12px;
}

【讨论】：

【解决方案2】：

为什么不添加到您的 CSS 中：

.sub-menu{
  text-align:left;
}

您可能还想添加padding-left:12px 以“更好地”对齐子菜单项。

【讨论】：

【解决方案3】：

你的意思是：

文本对齐：左；

在 /wp-content/themes/designfolio-pro/style.css?ver=3.8.1

nav ul ul {
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    display: none;
    float: left;
    left: -1px;
    list-style: none outside none;
    margin: 0;
    position: absolute;
    text-align: left;
    top: 30px;
    width: 150px;
    z-index: 89;
}

【讨论】：

我同意它已经存在但无法正常工作 - 修复上述工作！