CSS3: after Overriding: last-child

У меня есть следующий CSS для стилизации простого списка:

ul.menu_list li {
display: inline;
}
ul.menu_list li:after {
content:" | ";
}
ul.menu_list li:last-child  {
content:"";
}

<ul class="menu_list">
  <li><a href="">Link</a></li>
  <li><a href="">Link</a></li>
  <li><a href="">Link</a></li>
</ul>

Я получаю желаемый эффект, за исключением того, что последний дочерний элемент не теряет вертикальную полосу, "|" .

Link | Link | Link |

Я пробовал комбинировать: after: last-child и наоборот, но первое объявление: after всегда имеет приоритет.

5
задан BoltClock 17 October 2011 в 03:39
поделиться