css - div の背景画像が表示されない

Question

動的に次のことを行います。

'<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;
}

上記のコードは機能しています（画像とテキストは水平方向に中央に配置され、画像はテキストの上にあります）が、画像（img）を使用する代わりに、divの背景画像に置き換えたいので、以下を行います：

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

ここで、image-blockUI を次のように置き換えます。

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

この場合、テキストは水平方向に中央揃えで表示されますが、背景画像は表示されません。私は何を間違っていますか？

Answer 1

そのはずbackground-image: url('../../images/Edit.gif');