Отключите border-left для ссылки, если ссылка распространяется на новую строку

0

У меня есть вопрос относительно вопроса, который у меня есть с разделителем каналов между ссылками в subnav bar. Мои ссылки имеют левую границу одного пикселя (разделитель каналов), при этом первая ссылка отключает левую границу. Моя проблема заключается в том, что когда ссылки расширяются мимо их контейнера и расширяются до новой строки, первая ссылка на новую строку будет иметь границу слева от одного пикселя. Итак, мой вопрос: как отключить границу слева, если ссылка является первым элементом новой строки? Имейте в виду, что количество ссылок и имя ссылок в моем субнавце меняются в зависимости от страницы, на которой в данный момент находится пользователь. Итак, селектор "nth-child()", похоже, не может быть и речи. Я думал об использовании метода JQuery.offset()... но это, похоже, не правильный путь. Любая помощь или предложения были бы замечательными.

Спасибо вам, -Kyle

Вот пример: Демо

<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;
}
  • 0
    Рассматривали ли вы вместо этого использование правой границы, где последняя ссылка отключает правую границу? Конечно, перед новой строкой будет правая граница, но подойдет ли это вашей цели?
  • 0
    Как насчет этого: jsfiddle.net/gUk5r

1 ответ

2
Лучший ответ

Вы можете заставить каждую ссылку иметь левую границу (так что просто удалите код для первой ссылки), переместите их 1px влево с помощью margin-left: -1px и вырежьте границу с overflow: hidden. См. Http://jsfiddle.net/3DU6d/

  • 0
    Большое вам спасибо, Риа! Я ценю вашу помощь.
  • 0
    всегда пожалуйста

Ещё вопросы

Сообщество Overcoder
Наверх
Меню