Сделайте ширину svg 100%

#svg

#svg

Вопрос:

У меня есть SVG, но я не могу установить его ширину на 100%. Как я могу это исправить?

 body {
background: black
} 
 <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="50" version="1.1" viewBox="0 0 317 13.2">
 <g transform="translate(-0.5 -284)" style="
    width: 1500px;
">
  <path fill="#fff" width="100%" transform="matrix(.265 0 0 .265 0 284)" d="m0 0v50h1200v-50h-560a40 40 0 0 1-40 40 40 40 0 0 1-40-40h-560z" fill-rule="evenodd" style="paint-order:markers fill stroke"></path>
 </g>
</svg> 

Я пытался написать атрибут width=»100%», но это не работает.

Комментарии:

1. Уверен, что это работает. Это только поле просмотра, которое не охватывает ширину. Какой результат вы ищете? Фиксированная высота или фиксированное соотношение сторон?

2. @ccprog Я хочу, чтобы ширина белого фона составляла 100%.

3. И какая высота?

4. @ccprog высота 50 пикселей

5. Затем добавьте атрибут preserveAspectRatio="none" к <svg> элементу. Обратите внимание, что вырез больше не будет круглым, если размеры будут искажены.