Каталог сайта лестницей

[Bel.site]

Добрый вечер друзья, подскажите пожалуйста, как сделать меню лестницей сейчас оно вот такое:


Но хочу сделать вот такое:


Не могу сделать голова уже болит....

 

[Provokator86]

Добрый вечер друзья, подскажите пожалуйста, как сделать меню лестницей сейчас оно вот такое:
Посмотреть вложение 83692

Но хочу сделать вот такое:
Посмотреть вложение 83693

Не могу сделать голова уже болит....

Css: margin-left: 10px; к <li> каждого пункта
Вообще не плохо было бы показать пример кода

 

[diex]

Добрый вечер друзья, подскажите пожалуйста, как сделать меню лестницей сейчас оно вот такое:
Посмотреть вложение 83692

Но хочу сделать вот такое:
Посмотреть вложение 83693

Не могу сделать голова уже болит....

все довольно просто, допишите CSS стиль для вашего меню:

ul li:nth-child(1) {
margin-left: 0px!important;
}
ul li:nth-child(2) {
margin-left: 10px!important;
}
ul li:nth-child(3) {
margin-left: 25px!important;
}
и т.д.

 

[Bel.site]

все довольно просто, допишите CSS стиль для вашего меню:

ul li:nth-child(1) {
margin-left: 0px!important;
}
ul li:nth-child(2) {
margin-left: 10px!important;
}
ul li:nth-child(3) {
margin-left: 25px!important;
}
и т.д.

А как сделать что 1 урл был красным как на скрине?

 

[diex]

Помогло очень спасибо. А как сделать и тут лестницей имея Название статьи и краткое описание
Посмотреть вложение 83704
Они имуют 2 класса

Как бы в этом же стиле, подставляйте вместо тега свой класс:

li:nth-child(5n + 1) {
    margin-left: 0px;
}
li p:nth-child(5n + 1) {
    margin-left: 5px;
}
li:nth-child(5n + 2) {
    margin-left: 10px;
}
li p:nth-child(5n + 2) {
    margin-left: 15px;
}

 

[Bel.site]

Как бы в этом же стиле, подставляйте вместо тега свой класс:

li:nth-child(5n + 1) {
    margin-left: 0px;
}
li p:nth-child(5n + 1) {
    margin-left: 5px;
}
li:nth-child(5n + 2) {
    margin-left: 10px;
}
li p:nth-child(5n + 2) {
    margin-left: 15px;
}

Да тоже помогло, только вот ещё вопрос

Чёрточку по меж их <hr> как влепить?

 

[diex]

А как сделать что 1 урл был красным как на скрине?

Чтобы ссылка была красного цвета статически, то нужно прописать для этого элемента:
li a:nth-child(5n + 3) {
color: #ff0000;
}

Да тоже помогло, только вот ещё вопрос
Посмотреть вложение 83708
Чёрточку по меж их <hr> как влепить?

Это уже нужно смотреть в шаблоне вывода материалов, через CSS это не могу сделать, можно попробовать с помощью JavaScript, но лучше всего поправьте шаблон вывода новостей.

 

[Bel.site]

Это уже нужно смотреть в шаблоне вывода материалов, через CSS это не могу сделать, можно попробовать с помощью JavaScript, но лучше всего поправьте шаблон вывода новостей.

Не выходит чтоб урл 1 был красным

 

[diex]

Посмотреть вложение 83709 Не выходит чтоб урл 1 был красным

Вот так попробуйте:
ul li:nth-child(3) a {
color: #f00!important;
}

 

[Bel.site]

Вот так попробуйте:
ul li:nth-child(3) a {
color: #f00!important;
}

А можете подсказать, как до этого элемента дойти?? Череп сломал уже