Как задать рамку сложной формы с помощью HTML/CSS?

Question

[big_hasan]

Как реализовать рамку вокруг контента с круглой областью для логотипа? Что-то совсем встал в ступор и не знаю с какой стороны подойти - думаю, у новичков такое бывает, нужен волшебный пинок в нужную сторону.

LOGO - не обязательно графический логотип, может быть просто текстовой областью

Answer 1

[Дмитрий]

как вариант - https://jsfiddle.net/soledar10/rnrf3rn8/
или так - jsfiddle.net/soledar10/ezvbhxL0

Comments

[big_hasan]

Благодарю за ответ. Второй вариант подходит - я его обходил, т.к. он описывается в справочниках как применяемый "для группирования элементов форм".
Скажите, а можно ли как-то позиционировать без "position: absolute" элемент logo таким образом, чтобы он был, так сказать, непрозрачным, выглядел с элементом content как единый неразрывный элемент?

[Дмитрий]

можно так https://jsfiddle.net/soledar10/4sk9n1m0/

[big_hasan]

Дмитрий: Ааа, background-color же, точно! Еще раз спасибо, очень помогли!

Answer 2

[Антон Федорян]

Рамка задается так же, свойством border
https://jsfiddle.net/slippyk/v4w7wgqc/

Comments

[big_hasan]

Спасибо. Тот же вопрос: можно ли как-то выдвинуть элемент logo на передний план, сделать его непрозрачным без "position: absolute"