0

我正在尝试在Concrete5 站点中的菜单项之间实现分隔线,并尝试通过为每个菜单项添加右边框然后使用 :first-child 伪类在第一个之前添加分隔符来实现。但是,伪类将被忽略,并且每个菜单项的两侧都添加了边框。这是代码:

.top-bar-section ul li > a {
    display: block;
    width: 100%;
    color: white;
    padding: 12px 0 12px 0;
    padding-left: 15px;
    font-size: 0.8125em;
    font-weight: bold;
    background: #0D42C0; 
    border-right: 1px solid white;
}
    .top-bar-section ul li > a:first-child {
          border-left: 1px solid white;
}

我不知道 CMS 生成的 HTML 菜单的确切结构,但这些选择器似乎可以正常工作。不确定是否还有其他需要帮助解决此问题。让我知道是否需要更多信息来诊断此问题。

非常感谢任何帮助!

4

1 回答 1

0

所有的<a>s 都是它们各自<li>s 的第一个孩子。您需要以第一个为目标<li>。尝试这个:

.top-bar-section ul li:first-child > a {
      border-left: 1px solid white;
}

为了将来参考,请在问题中包含您的 HTML。

于 2013-07-13T18:36:47.853 回答