Как сверстать меню (активная кнопка)?

Question

[Алексей Непомнящий]

Всем доброго вечера. Как сверстать такое меню, чтобы при наведении курсора, так же было как на картинке. Спасибо за внимание и помощь.

Answer 1

[ⓒⓢⓢ]

При skew вам надо будет обрезать углы, у крайних элементов, с помощью родителя, установив overflow (что не всегда удобно при выпадающих списках).
Есть ещё вариант залить фоном:
https://codepen.io/anon/pen/rEVjed?editors=1100

Answer 2

[ReActor Дмитрий Вершанский]

Пожалуйста https://jsfiddle.net/HunteR_VRX/d56r3we8/230/

Comments

[ReActor Дмитрий Вершанский]

Ключевой момент в свойстве transform и функции skew()

[Ankhena]

HunteR-VRX, обратную забыли

И лучше на псевдоэлемент перевесить https://jsfiddle.net/0o1f5vy9/