Как сверстать border с отступом?

Question

[yura_89]

Здравствуйте!
Столкнулся с проблемой, которую не могу самостоятельно решить. Хотя почти уверен, что ее решение лежит на поверхности.

Есть вот такой блок, в нем есть border, который при :hover будет меняться. Проблема сделать именно border с таким отступом, с чем я не могу самостоятельно справиться. Может подскажет кто-нибудь какие-то варианты решения проблемы?
На ум приходит пока только 4 отдельных класса , каждый из которых будет иметь свой border (ну или background).

Answer 1

[Ваня]

Вот пример с позиционированием https://jsfiddle.net/jo34yv4h/

Comments

[yura_89]

спасибо!

Answer 2

[Rithmsamba]

Используйте отрицательный margin
Примерно вот так

Comments

[yura_89]

спасибо!