-1

I have a div where I set the background-image url() my problem is that I want to achieve something like this background-image url('example') cover center

At the moment, my code looks like this

div {
   background-image: url(example);
   background-size: cover;
   background-position: center;
}

As I mentioned earlier I want to achieve something like this

div {
   background-image: url(example) cover center;
}
Synchro
  • 1,105
  • 3
  • 14
  • 44

2 Answers2

0

background-image only supports images and that way you can overlay them using filters. It's not possible to directly say what it is supposed to look like. For that you'll still have to use background-size and background-position

BigBongo
  • 1
  • 6
0

You should be able to find the reference of css background-image effects and how to center and make your image fit the cover of the screen here: https://www.w3schools.com/htmL/html_images_background.asp

I would try using the following code below it may solve your problem:

.yourDiv {
  background-image: url('Background URL here');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: 100% 100%;
}
Aidan Young
  • 102
  • 2
  • 6