Как сделать такую кнопку с скошенными углами адаптивной?

Question

[Дима Долготер]

Как сделать такую кнопку, но чтобы она была:

• адаптивной - текста может быть больше, он может переноситься на другу строку но чтоб скошенные углы не менялись от размеров текста, чтоб задавались жестко
  
• без трюков с "делаем before и after, поворачиваем их на 45 градусов и делаем одну сторону в цвет и толщину основной рамки" такая штука не проканает, потому что фоны кнопки могут быть разные и фон before и after нельзя сделать позрачным потому что он перерывает реальный угол блока
  
• чтоб можно было сделать ховер на кнопку с box-shadow и именно вдоль всей кнопки засветились края
  
  
  

Answer 1

[Вадим]

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

Добавил адаптацию под Ваш случай

Comments

[Дима Долготер]

нельзя примеить box-shadow и border для ховера. Как тут быть?

[Вадим]

Дима Долготер, Тень можно добавить если обернуть кнопку в див и задать ему filter: drop-shadow.

На счёт ховера не понятно что Вы имеете в виду

[Дима Долготер]

Вадим, filter: drop-shadow. в обертке не работает

[Вадим]

Дима Долготер, а у меня работает почему то.