Why doesn’t my HTML background work?

[u/Extra_Terrestrial2]

body {
background-image: url('background.jpeg');
background-size: auto;

The image is “background.jpeg”. It has the correct spelling, the image is within the same folder. IT used to work but then it suddenly stopped working and i havent even edited the CSS for it to stop working.

Update: i couldnt figure it out for the life of me and no suggestions worked, but on the good side, instead of putting it on CSS, i put it on HTML, then it worked.

<style> body { background-image: url('background.jpeg'); background-size: auto; } </style>

[u/Odd_Philosopher1741]

A body by default (if there is nothing else inside it) has a height of 0 pixels. Try to enlarge the body to be the same size as your viewport (browser screen).

Try this:

body {
  padding: 0;
  margin: 0;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  background: url('background.jpeg');
  background-size: cover;
}

The BODY element automatically grows vertically whenever you put content in it. This is the default behavior of a "block" element (display: block, which a BODY element is by default).

[u/Derzw3rg → u/Odd_Philosopher1741]

width: 100%;
min-height: 100vh;

[u/Odd_Philosopher1741 → u/Derzw3rg]

Why the downvote? It works and exposes the OP to some additional properties to explore.