Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
By arnemaine on
I'm working on my site using MAMP. It seems like I need to use an absolute URL path to call in a background image.
Here's the absolute URL that's working:
.header-top-inner {
background-image: url("http://localhost/layouttests/sites/all/themes/fusion/starter_layouttest/images/button_sprite.png");
background-repeat: no-repeat;
}
When I try to make the URL as root relative it doesn't work:
.header-top-inner {
background-image: url("/sites/all/themes/fusion/starter_layouttest/images/button_sprite.png");
background-repeat: no-repeat;
}
Can anyone tell me what I'm doing wrong?
Comments
Have you tried just
Have you tried just 'images/button_sprite.png'?
Also, if you use Firefox you can use firebug and under the 'net' tab see what the browser is resolving the url to.
Solved: needed to be document relative
Had some great advice, and found out I needed to use a path relative to the CSS file in my directory.
So needed to be
background-image: url("../images/imagename.png")
So all set!
agree
This worked for me too. Note that changing the url as suggested in firebug won't show the correct file. You need try it in the css itself.