Skip to content
● Grav 2.2 is out: 2x faster cold starts and 96% less memory on big sites. Read the announcement →

Is it possible to set the background image inside .CSS file as we normally do we plain HTML?

Solved by Karmalakas View solution

Started by payman 6 years ago · 1 replies · 1002 views
6 years ago

I am migrating my website (written with HTML, CSS, and JS) into a GRAV project. I have a long set of media rules inside my CSS files for my background images. But when I run the project, the Images are not read. It seems they are being ignored.

CSS
    @media (min-width: 3200px) and (-webkit-min-device-pixel-ratio: 2),
  (min-width: 3200px) and (min-resolution: 2dppx) {
  [data-visible='true'] .image-2sy_q {
    background-image: url('../images/image_1a9jevki6koxp9.jpg');
  }
}
@media (min-width: 3840px) {
  [data-visible='true'] .image-2sy_q {
    background-image: url('../images/image_1a9jevki6koxp9.jpg');
  }
}
@media (min-width: 3840px) and (-webkit-min-device-pixel-ratio: 2),
  (min-width: 3840px) and (min-resolution: 2dppx) {
  [data-visible='true'] .image-2sy_q {
    background-image: url('../images/image_1a9jevki6koxp9.jpg');
  }

Is there a way to fix this?

thanks

6 years ago Solution

Don't have ATM how to test, but I guess paths are incorrect. Try changing to /user/themes/myTheme/images/image_1a9jevki6koxp9.jpg or similar, depending on where your images are at

👍 1

Suggested topics

Topic Participants Replies Views Activity
General · by Andy Miller, 3 days ago
0 72 3 days ago
General · by lynbor, 4 weeks ago
3 411 2 weeks ago
General · by lynbor, 2 weeks ago
7 526 2 weeks ago
General · by Harry, 2 weeks ago
0 143 2 weeks ago
General · by Old Man Umby, 4 weeks ago
2 290 3 weeks ago