Solution 1 :

The first commenter was right, but you need to use it like this:

  background: url(images/Group2264.svg) no-repeat;
  background-size: cover;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0px;
  top: 0px;

Solution 2 :

background-size: cover; : “sets the size of the element’s background image” – MDN.


width: 100%; : to fill up the parent 100%, width wise. (very pseudo responsive)

height: 100%; : to fill up parent 100%, height wise. (very pseudo reponsive)

Problem :

I am writing a website and I have a problem. The background picture is not enlarged.
Here is a picture:
enter image description here


    <!DOCTYPE html>
  <link rel="stylesheet" type="text/css" href="style.css">
  <link rel="reset.css">
  <header class="header">


  background: url(images/Group2264.svg) no-repeat;
  position: absolute;
  width: 3000px;
  height: 2000px;
  left: 0px;
  top: 0px;

Help me with this please!


Comment posted by corn on the cob

background-size: cover should help

Comment posted by Andy Hoffman

Some explanation would help improve this answer.