@Rem36

Я дико извиняюсь, но не пойму что не так?

<ul class="list-items">
                    <li class="item">
                        <div class="img-and-fon">
                            <div class="img-con-menu"><img src="img/2.png"></div>
                            <div class="fon-for-icon"><p>
                                Справочная информация
                            </p></div>
                        </div>
                    </li>
                    <li class="item">
                        <div class="img-and-fon">
                            <div class="img-con-menu"><img src="img/1.png"></div>
                            <div class="fon-for-icon"><p>Научно методические материалы</p></div>
                        </div>
                    </li>

                    <li class="item">
                        <div class="img-and-fon">
                            <div class="img-con-menu"><img src="img/3.png"></div>
                            <div class="fon-for-icon">
                                <p>Информационный
                                    стенд</p>
                            </div>
                        </div>
                    </li>
                    <li class="item">
                        <div class="img-and-fon">
                            <div class="img-con-menu"><img src="img/5.png"></div>
                            <div class="fon-for-icon">
                                <p>Журнал
                                    использованных
                                    ампул</p>
                            </div>
                        </div>
                    </li>


Не одно перечисленное ниже не работает.

.item p:nth-child(4){
    margin-top: 40px;
    margin-right: 60px;
}

.item.img-and-fon.fon-for-menu p:nth-child(4){
    margin-top: 40px;
    margin-right: 60px;
}

.item .img-and-fon .fon-for-menu p:nth-child(4){
    margin-top: 40px;
    margin-right: 60px;
}

li.img-and-fon.fon-for-menu p:nth-child(4){
    margin-top: 40px;
    margin-right: 60px;
}

li.item .img-and-fon .fon-for-menu p:nth-child(4){
    margin-top: 40px;
    margin-right: 60px;
}
  • Вопрос задан
  • 109 просмотров
Решения вопроса 1
@vladchv
WordPress Developer
.list-items .item:nth-child(4) p {
    ...
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
Adamos
@Adamos
Щелкните правой кнопочкой по элементу - и браузер в выпавшем меню предложит посмотреть его код, а заодно - какие стили к нему реально применены и чем перекрыты.
Гораздо эффективнее, чем гадание на Тостере, тем более, что, скорее всего, здесь приведены далеко не все стили, реально присутствующие на сайте.

P.S.
Здесь, впрочем, речь скорее о НЕ примененных стилях.
:nth-child(4) - это четвертый элемент внутри одного контейнера, а не четвертый из встретившихся на всей странице. Видимо, имелся в виду li.item:nth-child(4) ...
Ответ написан
@MisTFoR
.item p{
    margin-top: 40px;
    margin-right: 60px;
}

.item .img-and-fon .fon-for-icon p{
    margin-top: 40px;
    margin-right: 60px;
}

.item .img-and-fon .fon-for-icon p{
    margin-top: 40px;
    margin-right: 60px;
}

li .img-and-fon .fon-for-icon p{
    margin-top: 40px;
    margin-right: 60px;
}

li.item .img-and-fon .fon-for-icon p{
    margin-top: 40px;
    margin-right: 60px;
}


Я заметил, что вы всем "p" задаете один и тот же стиль. Зачем?
Можно сделать так:
.list-items .item .fon-for-icon p{
    margin-top: 40px;
    margin-right: 60px;
}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы