svg на всю высоту и ширину

#html #css #svg

Есть такой блок svg:



html,body, svg {
  width: 100%; height: 100%;
  margin: 0; padding: 0;
}

body {
  background: #ccc;
}





Можно ли  растянуть svg на всю высоту и ширину блока  без пробелов по бокам или вверху
и внизу? Сейчас он пропорционально меняет свои размеры.

Не обрезать и не ставить на фон, так как в оригинале форма не совсем квадрат, как
в  примере, а волнистая поверхность. Просто  для примера:



html,body, svg {
  width: 100%; height: 100%;
   margin: 0; padding: 0;
}

body {
  background: #ccc;
}




    

Ответы

Ответ 1

Чтобы растянуть на всю длину без сохранения пропорций - preserveAspectRatio="none"  



html,body, svg {
  width: 100%; height: 100%;
   margin: 0; padding: 0;