Background image not loading

Question

I am new to html/css and I do not understand why my background image is not showing up. This is part of a simple test CSS sheet and HTML code for a simple site. I am trying to add a background-image and I have done this once and it worked and I do not know why it does not work now.

.timeline{
    width: 100%;
    height: 400px;
    display: inline-flex;
    background-image:url("img/back.jpg");
}

Answer 1

Your rule is wrong. You are trying to set background-image , background-position and other rules, but rule name is only background-image .

Use background instead of background-image

Answer 2

Your syntax for background-image is incorrect

You need to use background-repeat: repeat; for repeat. Here is doc background-image

.timeline{
  width: 100%;
  height: 400px;
  display: inline-flex;
  background-image:url("img/back.jpg");
  background-repeat: repeat;
}

Answer 3

Try replace this code

display:inline-flex;

to this code

display:flex;

Answer 4

This works. Asuming your file path is correct.

.timeline{
width: 100%;
height: 400px;
display: inline-flex;

background-image: url(img/back.jpg); }

Answer 5

.timeline{
  width: 100%;
  height: 400px;
  display: inline-flex;
  background-image:url("./img/back.jpg");

}