Как стилизовать пункт списка с кастомным маркером?

Question

[Black_Fire]

Нужно применить list-style-position к спискам, но так как стандартный маркер отменен и вместо него кастомный, то свойство не срабатывает. Нужно, чтобы были отступы как на скрине.

Сниппет здесь

Answer 1

[Антон Литвиненко]

ul.list {
	margin: 0;
	padding: 0;
	list-style-type: none;
	counter-reset: list-counter;
	li {
		position: relative;
		padding-left: 30px;
		&::before {
			counter-increment: list-counter;
			content: counters(list-counter,".") " ";
			position: absolute;
			left: 0;
			top: 5px;
			display: block;
			font-size: 12px;
		}
	}
}

Comments

[Black_Fire]

Чет немного не то. Маркеры должны быть как на скрине.

[Антон Литвиненко]

Black_Fire, точно, ведущий ноль лишний, убрал. в кружочки, надеюсь, сами сможете завернуть?

[Black_Fire]

Антон Литвиненко, не знаю. При таких раскладах у меня даже псевдоелемент в девтулзах не появляется.

[Антон Литвиненко]

Black_Fire, content: counters
Я проверил у себя

Answer 2

[SashaYue12345]

Через &:before или &:after, через background-image и абсолютом прикрепить к li, а для текста в li дать отступ