Как реализовать?

Question

[Алексей Орлов]

Как реализовать, чтобы линии перед и после заголовка выходили за пределы контейнера и были во всю ширину, но заголовок оставался в нём. При этом линии будут оставаться на одинаковом расстоянии от заголовка при любом разрешении.
Песочница

Answer 1

[inkShio]

https://codepen.io/inkshio/pen/mjmbrM - что то типо того можешь сделать

Comments

[Алексей Орлов]

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

[inkShio]

обнови, или у h2 ширину сам убери и будет тебе счастье.

[Алексей Орлов]

inkShio, Спасибо, просто думал насколько в порядке вещей ставить для body - overflow-x:hidden )

[Вадим Кот]

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

https://codepen.io/anon/pen/ZjKEKL

[inkShio]

Алексей Орлов, если не нравиться body - overflow-x: hidden; ты можешь сделать линию на весь контейнер, и после наложить на линию заголовок с белым фоном.

[inkShio]

типо того https://codepen.io/inkshio/pen/qymWMr

[Алексей Орлов]

inkShio, Опа, спасибо, вот это мысль)

Answer 2

[Максим Тимофеев]

https://codepen.io/inteia/pen/fDjcg

Comments

[Алексей Орлов]

там линии не выходят за пределы контейнера и заголовок располагается по центру, так я тоже умею) , а мне нужно чтобы заголовок располагался слева в контейнера , но линии были как и в контейнере, так и за его пределы тянулись..