Почему псевдо-класс «последнего типа» не работает? - PullRequest
0 голосов
/ 20 апреля 2019

У меня есть раздел в моем HTML с четырьмя <div> тегами.Я хочу выбрать последний из них с помощью CSS и применить margin-top, но, очевидно, псевдокласс last-of-type работает неправильно.То же самое происходит с nth-of-type.Почему это происходит?Мой код ниже:

HTML

    <section id="lastsection">
    <div>
    <h2>Design Heading</h2>
    <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p>
    </div>
    <div>
    <h2>Design Trends</h2>
    <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p>
    </div>
    <div>
    <h2>Design Users</h2>
    <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p>
    <a href="#">Get Started</a>
    </div>
    <div>
    <h2>Design Goals</h2>
    <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p>
    <a href="#">Buy Now</a>
    </div>
</section>

CSS

    #lastsection a{
    float: right;
}
#lastsection div:last-of-type{
    margin-top: 50px;
}

1 Ответ

0 голосов
/ 21 апреля 2019

Верхние поля игнорируются (переопределяются), когда свойство clear вступает в силу для перемещения элемента ниже нижнего края всплывающего элемента.

Чтобы предложить альтернативу, скажите нам, почему вы хотите установить для этого элемента другое верхнее поле.

...