Как сверстать пунктирную рамку такой неправильной формы у блока?

Question

[toster111]

Нужно сверстать блок с такой рамкой


Сам блок может менять ширину и высоту, внутри него текст, есть эта рамка в svg
Хотелось бы самым универсальным, насколько это возможно, способом сделать такую рамку, а не делать ее фоном и подгонять по размерам

Comments

[Ankhena]

Просто svg на фоне или border-image.

[toster111]

svg на фоне пробовала, но тогда блок не может нормально тянуться, тк высота и ширина строго прописаны

[Ankhena]

toster111, не пишите строго высоту и ширину.
Правда, при нарушении пропорций вертикальные и горизонтальные штришки будут отличаться.

Answer 1

[RAX7]

Нарисовать на js ¯\_(ツ)_/¯

Comments

[Антон]

вот вы заморочились)

Answer 2

[Александр Епихин]

Можно например так https://codepen.io/leshiple/pen/abNxVVx?editors=1100

Comments

[toster111]

Александр Епихин, Да, пробовала, думала, что это лучшее решение, но под этим блоком градиентный фон, и задать нормальный цвет left и right не получается, видно что они не прозрачные
и вообще в теории фон может быть любого цвета и прописывать его left и right не хочется