Excuse me, I am facing an issue with a pipe separator in my subnav bar between links. The problem is that the first link on a new line retains the left-border that should be disabled. How can I prevent this border from appearing on the first link of a new line? The challenge is that the number and names of the links vary based on the page the user is on, so using the "nth-child()" selector is not a viable solution. I considered using the JQuery .offset() method, but it doesn't seem like the right approach. Any help or suggestions would be greatly appreciated.
Thank you, -Kyle
For a better understanding, please refer to this example: Demo
<div class="container">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
<a href="#">Link 6</a>
<a href="#">Link 7</a>
<a href="#">Link 8</a>
<a href="#">Link 9</a>
<a href="#">Link 10</a>
</div>
.container {
width: 300px;
}
.container a {
color: #999;
text-decoration: none;
margin: 10px 0 0 0;
padding: 0px 10px;
border-left: 1px solid;
float: left;
}
.container a:first-child {
border-left: none;
padding: 0 10px 0 0;
}