Dasmoto's Arts & Crafts

The background image of my header does not appear. I have rechecked the right selector many times and that is the only problem. Can you help me resolve this?

.header {

background-image: url('./resources/images/pattern.webp');

}

h1 {

font-family:Helvetica;

font-size:100px;

font-weight:bold;

color:khaki;

text-align: center;

}

.title {

font-family: Helvetica;

font-size: 32px;

font-weight: bold;

color: white;

}

.brush {

background-color: mediumspringgreen;

}

.frame {

background-color: lightcoral;

}

.paint {

background-color: skyblue;

}

.blue {

color: blue;

font-weight: bold;

font-family: Helvetica;

}

*{

font-family: Helvetica;

}

1 Like

Welcome to the community @michaeladrian!! :slight_smile:

Did you save the background image in your project’s filesystem, using the path ./resources/images/pattern.webp ???

I had a problem with mine when I did this project because I needed to go backwards through the file-path twice, which means I needed two “.” or ../resources/images/pattern.webp

Each period moves higher into the filesystem. Anyway, that was my problem, I’m not exactly sure what yours is because I can’t see the code for the entire project. I would just make sure you are declaring the correct path for your image.