how to set background image which cover full with using css

Question

I am trying to set my background image which should cover full width of screen .Currently it is only cover some % of full width. I used this css

.curve-img-container {
  background-image: url("../src/bg-curvy-desktop.svg");
  background-size: cover;
  width: 100%;
  height: 200px;
}

it looks like this (see in full screen mode) code sand box link

but it should look like that

here is my code

https://codesandbox.io/s/affectionate-cartwright-pw2mq?file=/src/styles.css:157-174

Answer 1

I have tried with firefox

.curve-img-container {
background-image: url("../src/bg-curvy-desktop.svg");
width: 100%;
height: 200px;
background-repeat: round;
}