хочу круто сделать маркеры справа, но все что-то не выходит пока

[adelante]

Хочу с помощью CSS сделать так, чтобы "новые" категории товара в панели ссылок интернет магазина обзавелись клёвым маркером справа от ссылки. Для этого использую всевдокласс :after и свойства marker-offset и display:marker:

<ul id="categories">	
	  <li class="new"><a href="#">Link</a> </li>
</ul>

ul#categories {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0
}

ul#categories li {
	height: 33px;
	list-style: none;
	line-height: 33px;
}


ul#categories li.new a:after{
	content: url(images/newcategorymarker.gif);
	display: marker;
	marker-offset: 1em;
}

Во последних версиях Opera, Firefox, Safari, Chrome не работает marker-offset почему-то, ну а в IE не работает вообще ничего.

Есть идеи по поводу marker-offset?

Для IE я вроде бы нашел вот это, но пока толи я его не так использую, толи оно не работает вовсе.

P.S. Альтернативные варианты решения, без участия :after тоже рассматриваются, но сам я пока удовлетворяющего не придумал.

P.P.S. Ещё одно решение по эмуляции :after для IE в моей интерпретации не помогло(я, правда, не очень понимаю в этих ие-хаках). Сделал вот так:

ul#categories li.new a:after{
	content: url(images/newcategorymarker.gif);
	display: marker;
	marker-offset: 1em;

	z-index: expression(
	runtimeStyle.zIndex = 1,
	innerHTML = "" + innerHTML + "<img src="images/newcategorymarker.gir" />"
  );
}

Edited December 28, 2010 by adelante

[deadrash]

Вообще непонятно при чём тут marker-offset: вы вообще что сделать хотите? Маркеру вы указали list-style: none; по этому нет смысла указывать marker-offset так как у вас просто нет маркеров, у вас есть созданый элемент, который распологается после вашего элемента li. Сделайте его отображение другим, например - display:block; width:10px height:10px; и относитесь к нему как к блоку. т.е. двигайте маргином паддингом или position:relative; right:1em; top:0;

В общем нужно понять что это уже не маркер списка, хотя по задумке это маркер.

Edited December 28, 2010 by deadrash

[adelante]

Спасибо, deadrash, сделал блоком и марджин-лефт, выглядит теперь нормально.

Только всё равно в ИЕ не отображается в принципе

[deadrash]

Спасибо, deadrash, сделал блоком и марджин-лефт, выглядит теперь нормально.

Если список будет в две строчки скорей всего придётся делать через position:relative; right:1em; top:0;

Только всё равно в ИЕ не отображается в принципе

Осёл 7 и ниже не понимают :hover.

По идее вот этот експрешен должен помочь http://www.xiper.net/collect/html-and-css-...ore-for-ie.html

[Vlad]

marker-offset вообще ни в одном браузере не работает и вряд ли когда будет.

dislpay: marker нет в спецификации, на сайте Мозиллы тоже не упомянут.

Может проще маркер через фон сделать, работать точно будет везде и без проблем?

[kmtd]

Спасибо, deadrash, сделал блоком и марджин-лефт, выглядит теперь нормально.

 

Покажите, пожалуйста, что получилось.

 

PS. Мне нужно сделать простой список для сайта на иврите (там все должно быть справа налево)

Edited January 20, 2016 by kmtd

[kmtd]

Уважаемые, покажите, пожалуйста исходный код (css+html) для такого списка, у которого маркеры находятся справа от элементов.

[Igor Schnaider]

link