CSS Background Image Not Displaying

CSS Background Image Not Displaying

According to your CSS file path, I will suppose it is at the same directory with your HTML page, you have to change the url as follows:

body { background: url(img/debut_dark.png) repeat 0 0; }

CSS: background-image: is not displaying my image (First time making a website and first time using stack overflow)

You shouldn't use the absolute path that's related to your computer, because it wont work elsewhere!

I think the problem comes from the use of \ in your paths. Try replacing them by '/'. I don't know exactly about your folders architecture but try something like this : images/aes.jpg

Issue with CSS background image (Image not Showing)

<a> tag is an inline element and without a content will not show the background, so You need to make it display as a block or inline-block element and then define the size of the element.

Try with:

.my-class {
display: block;
width: 128px;
height: 128px;
background: transparent url("../images/my-bg-image.png") no-repeat 0 center
}

For more information you can check the box model and the display property on the CSS 2.1 w3c standard.

Also the sections The width property and Computing widths and margins have an explanation of why the element doesn't show the background on an empty inline element.

Update:

Also the working draft of the CSS Box Model is available on the W3C site.

Update 2:

On a side note, relying only on a css background image for a link can have somme accessibility issues.



Related Topics



Leave a reply



Submit