Как сверстать такую рамку?
Просто нарисовать фоновыми градиентами к одному блоку.
https://jsfiddle.net/02hfmet3
Адаптивный и с контентом внутри https://jsfiddle.net/kn3ha48d/

Есть еще вариант с 2мя псевдоэлементами, но подходит только для однотонного фона и фикс ширины. Во-первых, из-за обводки, во-вторых, из-за округления. Если блок будет иметь фикс ширину, то округление не важно, просто нужно скорректировать в зависимости от четности или нечетности. 
https://jsfiddle.net/xm91ny4q/
1 блок + 8 spanов с абсолютным позиционированием отрицательно к блоку