user3597970
user3597970

Reputation: 21

Image not displaying in div

Im trying to get an background image displayed in a button div but its not showing up.

Changing background-image to background-color works and it displays a color in the correct spot the image should of been.

Im drawing a blank here: jsfiddle

This is the piece of code:

.strawberry {
height:65px;
width:100%;
background-image: url('src/bg_button.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center; 
overflow:hidden;
}

Im new to html5 so please be gentle.

Upvotes: 2

Views: 101

Answers (2)

artlung
artlung

Reputation: 34013

In a jsfiddle, an image referenced that way will need to be gotten from somewhere on the web. When I load your fiddle in Chrome, I get 404 not found errors:

Failed to load resource: the server responded with a status of 404 (Not Found) http://fiddle.jshell.net/m6AnC/13/show/src/bg.png http://fiddle.jshell.net/m6AnC/13/show/src/header.jpg http://fiddle.jshell.net/m6AnC/13/show/src/bg_button.jpg

See: Adding images in JSfiddle

Upvotes: 0

I am Cavic
I am Cavic

Reputation: 1085

It is possible that you are not in the correct folder try this:

.strawberry {
    height: 65px;
    width: 100%;
    background: url("../src/bg_button.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    overflow: hidden;
}

Upvotes: 2

Related Questions