Menu
In amongst my CSS I have the following:
#framecontentTop{
position: absolute;
top: 0;
left: 120px;
right: 0;
height: 100px;
overflow: hidden;
background-image: url(/Users/myname/Website Project/logo.jpg);
color: white;
}
Where the path to the image I want to use as the background-image is /Users/myname/Website Project/logo.jpg
However, when I put in my div with the ID framecontentTop, it doesn't show the image (or indeed anything) as the background. There are no other divs in the CSS to conflict with it, and when I set the background for framecontentTop to a colour or keep it as an image but put the URL as some random image online, it loads it fine. So I can only assume the problem is with how I have specified the path to the image - can anyone see what I have done wrong here?
Many thanks
396
Make sure the image path is set correctly in the background-image url. Once you have made sure that your CSS file is linked correctly, also check that the image itself is set correctly. Again, you will want to open your code inspector in the browser to check.
Usage is simple — you insert the path to the image you want to include in your page inside the brackets of url() , for example: background-image: url('images/my-image. png');
Assuming that your . png file actually exists, try setting the background size and repeat tags. If that doesn't work, try checking in your browser's developer tools for the response codes and making sure that the url is correct.
If you have any special characters, they should be escaped, or in the case of white-space, at least quoted, like this:
background-image: url("/Users/myname/Website Project/logo.jpg");
You can see the W3C Spec for the full requirements.
Some characters appearing in an unquoted URI, such as parentheses, commas, white space characters, single quotes (') and double quotes ("), must be escaped with a backslash so that the resulting URI value is a URI token: '(', ')', '\,'.
51
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
