对齐下拉菜单 - 左

Question

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

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

您可以通过转到

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

将鼠标悬停在"业务服务"上看到下拉菜单了吗？我希望它向左对齐，以便诸如"牛津实践工作室"之类的页面链接将使两个句子直接在"商业服务"下方向左浮动。

非常感谢，

山 姆

Answer 1

使用 '

text-align：left to .sub-menu' 将文本向左对齐

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

添加左边距以将子菜单与主菜单项对齐

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

Answer 2

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

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

您可能还希望添加padding-left:12px以"更好地"对齐子菜单项。

Answer 3

你的意思是：

文本对齐：左;

in/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;
}