Border-image

[Евгений_SB]

Ребят здравствуйте подскажите почему не работает код
нужно сделать бордер картинкой только с одной стороны

	border-image: url("../img/brimg.png");
	border-top:0;
	border-left: 0;
	border-bottom: 0;

или подскажите как сделать такие разделители

при условии что ховер должен быть таким

как вариант я использовал бордер но он заполняет всю сторону блока,

Edited August 8, 2017 by Евгений_SB

[SelenIT]

Border-image по умолчанию заполняет толщину обычного border-а, а она по умолчанию нулевая. Плюс Хром и ему подобные требуют, чтобы border-style тоже был не none. Подробнее здесь: http://css-live.ru/articles-css/understanding-border-image.html.

Но на мой взгляд, border-image для этой задачи — из пушки по воробьям. А проще всего сделать эту палочку неповторяющимся одноцветным градиентом, ограничив ему background-size, типа такого:

background: #4ccfc1 linear-gradient(#fff,#fff) left center no-repeat;
background-size: 1px 0.8em;

А по :hover менять только background-color.

[Евгений_SB]

1 час назад, SelenIT сказал:

Border-image по умолчанию заполняет толщину обычного border-а, а она по умолчанию нулевая. Плюс Хром и ему подобные требуют, чтобы border-style тоже был не none. Подробнее здесь: http://css-live.ru/articles-css/understanding-border-image.html.

Но на мой взгляд, border-image для этой задачи — из пушки по воробьям. А проще всего сделать эту палочку неповторяющимся одноцветным градиентом, ограничив ему background-size, типа такого:

background: #4ccfc1 linear-gradient(#fff,#fff) left center no-repeat;
background-size: 1px 0.8em;

А по :hover менять только background-color.

ваше решение подошло, но я так понимаю это как вариант, пробовал несколькими способами, через боковой бордер самый оптимальный вариант но согласно дизайна не подходит ибо ховер должен быть на всю высоту блока, пробовал использовать через псевдо элементы  типа content: "|"; но при наведении мышки они не очень хорошо себя ведут да и при увеличении пунктов меню начинают скакать, какие пункты меню будут я же не знаю поэтому этот вариант тоже не подошел,

хотелось бы услышать мнение других людей кто какой способ использует в таком случае