CODEWITHSUNDEEP
cssimagehtmlalignment
user304602
user304602

Reputation: 991

div's background-image not shown

Dynamically I do the following:

'<div><img class="image-blockUI" src="../../images/Edit.gif" /><p class="text-blockUI">Being edited.</p></div>'

css:

.image-blockUI 
{
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.text-blockUI
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    text-align: center;
}

Above code is working (image and text are centered horizontally, image above the text) but now instead of using an image (img) I want to replace it with a background-image for the div so I do below:

'<div"><div class="image-blockUI" /><p class="text-blockUI">Being edited.</p></div>'

now I replace image-blockUI with this:

.image-blockUI 
{
    height: 30px;
    width: 24px;
    background-image: '../../images/Edit.gif';
}

In this case, text is displayed and horizontally centered but background-image is not shown. What am I doing wrong?

Upvotes: 0

Views: 82

Answers (2)

geekster777
geekster777

Reputation: 297

it should be background-image: url('../../images/Edit.gif');

Upvotes: 2

Dima K
Dima K

Reputation: 130

if you use a relative path in a css file, the path is related to the location of the file (.css), so if your css file is not located in the same folder as your original html you need to correct it

Upvotes: 1

Related Questions