在菜单项之间添加分隔线(忽略伪类)

时间:2013-07-12 00:12:21

标签: php css menu concrete5

我正在尝试在a Concrete5 site中的菜单项之间实现分隔线,并试图通过向每个菜单项添加border-right然后使用: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菜单的确切结构,但这些选择器似乎正在运行。不确定是否还有其他任何需要帮助解决此问题。如果需要更多信息来诊断此问题,请告诉我。

非常感谢任何帮助!

1 个答案:

答案 0 :(得分:0)

所有<a>都是各自<li>的第一个孩子。您需要定位第一个<li>。试试这个:

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

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