Составной "content:" с помощью LESS

Статус
Закрыто для дальнейших ответов.

Liveforblaze

Новичок
Регистрация
22.04.2018
Сообщения
2
Собственно есть задача:

...
<li data-info="data 1">some-Text</li>
<li data-info="data 2">some-Text</li>
...
<li data-info="data N">some-Text</li>
Надо сделать чтобы, список выглядел следующим образом:

* some-Text with data 1
* some-Text with data 2
...
* some-Text with data N

Попытался реализовать я это с помощью псевдокласса:

li:after {
content: attr(data-info);
}
Но у меня получается следующее:

* some-Textdata 1
* some-Textdata 2
...
* some-Textdata N

Собственно как добавить слово "with" с пробелами?

Если использовать конструкцию:

@a: 'with ';
@b: attr(data-info);

content: "@{a} @{b}";
, то получается примерно следующее:

* some-Text with attr(data-info)
* some-Text with attr(data-info)
...

Помогите советом, я уже всю голову себе сломал. Надо реализовать с помощью CSS + LESS без JS
 

BaNru

Пацифизжу
Команда форума
Регистрация
13.11.2010
Сообщения
4 138
Смысл использовать LESS, там где и без него работает хорошо?

content: "with " attr(data-info);

Не забудь выставить display: inline-block;
 

Liveforblaze

Новичок
Регистрация
22.04.2018
Сообщения
2
Все оказалось гораздо проще чем я думал. Спасибо большое!
 
Статус
Закрыто для дальнейших ответов.
Верх Низ