Использование background-position с background-repeat для CSS-спрайта

Question

Вот демоверсия , а вот спрайт:

Я хочу использовать стрелку в разметке, например:

<div class="tooltip">
    The tooltip
    <span class="arrow"></span>
</div>

Установка:

background-image: url(foobar.gif);
background-position: 0 -40px;
background-repeat: none;

не работает (как и ожидалось).Есть обходной путь?

Answer 1

Вы имеете в виду:

background-repeat:no-repeat?

Answer 2

хм попробуйте это:

background: url(foobar.gif) 0 -40px no-repeat transparent;

должно быть на работе.

Answer 3

Используйте высоту и ширину точно ..

, например,

background-position: 0 -40px; 
background-repeat: no-repeat;
height:32px;
width:32px;

или используйте онлайн-генераторы спрайтов, и они будут отображать как изображения, так и CSS ..

Например: http://spritegen.website -performance.org /