CSS :last-of-type — останній елемент свого типу

HTML

<div>
    <p>Перший абзац.</p>
    <p>Останній p — червоний.</p>
    <footer>footer після нього — не абзац, тож не заважає.</footer>
</div>

CSS

p:last-of-type {
    background: #ff0000;
}

HTML

<div class="box">
    <p>Перший абзац.</p>
    <p>Останній абзац — нижній відступ треба зняти саме тут.</p>
    <button>Кнопка після абзаців</button>
</div>

CSS

.box {
    font: 16px/1.5 system-ui, sans-serif;
    max-width: 30rem;
    padding: 1rem;
    border: 1px solid #94a3b8;
    border-radius: 8px;
}

.box p {
    margin: 0 0 1.5rem;
    background: #eff6ff;
}

/* марно: остання дитина .box — це <button> */
.box p:last-child {
    background: #fee2e2;
}

/* а це працює: останній <p> серед сусідів */
.box p:last-of-type {
    margin-bottom: 0;
}