Динамически я делаю следующее:
'<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';
}
В этом случае текст отображается и горизонтально центрируется, но фоновое изображение не отображается. Что я делаю не так?
это должно быть background-image: url('../../images/Edit.gif');
если вы используете относительный путь в файле css, путь связан с расположением файла (.css), поэтому, если ваш файл css не находится в той же папке, что и исходный html, вам нужно исправить его