Создать прокручивать список, где перекрываться правая граница выбранного элемента

Я пытаюсь стиль списка со следующим эффектом:Создать прокручивать список, где перекрываться правая граница выбранного элемента

list where selected item is without right border

я могу добиться этого с помощью: после того, как, но это только если Листа Свойство overflow-y не настроено на прокрутку или авто (что приводит к тому, что overflow-x становится автоматически, см. this SO ответ). Если я установил абсолютное положение элемента после элемента, он не будет прокручиваться вместе со списком.

Любая идея, как я могу получить этот эффект в списке прокрутки?

Благодаря

источник

2015-07-03 Ronnyle

можете ли вы разместить html и css для списка? Я бы подумал, что вы просто установили границу 'li' в 3px или что-то еще, а затем 0 для выбранного элемента – Rhumborl

@Rhumborl Я не могу установить границы самих элементов, потому что тогда, когда список пуст, контейнер выиграл ' У нас есть границы. Таким образом, контейнер должен иметь правую границу, и выбранный элемент должен каким-то образом покрыть его. – Ronnyle

Простого решения для этого было бы использовать коробчатые теневое свойство для контейнера. Таким образом, элементы будут автоматически перезаписывать его, пока он будет виден, если контейнер пуст.

box-shadow: inset -1px 0 0 0 #C4CAD2;

Вот скрипка: http://jsfiddle.net/m93uzktj/

Кстати заметит, что скроллбары, расположенном справа от контейнера скрывающего эффекта.

источник

2015-07-03 21:50:23

Создать прокручивать список, где перекрываться правая граница выбранного элемента

ответ

Смежные вопросы