CSS: применить стили ко всем элементам, кроме первого и последнего

Question

Здравствуйте, товарищи!

Каким образом можно применить стили ко всем элементам, кроме первого и последнего?

<div class="content">
    <div class="item">...</div> <!-- первый элемент — margin: 0; -->
    <div class="item">...</div> <!-- стандартный элемент — margin: 10px 0; -->
    <div class="item">...</div> <!-- стандартный элемент — margin: 10px 0; -->
    <div class="item">...</div> <!-- последний элемент — margin: 0; -->
</div>

Вот так не работает:

.content > .item:not(:last-child):not(:first-child) {
    margin: 0 0 0 0;
}

так тоже:

.item:first-child,
.item:last-child {
    margin: 0 0 0 0;
}

Answer 1

Всё работает. Просто у вас где-то ещё это перекрывается

.content > .item:not(:last-child):not(:first-child) {
    margin: 0 0 0 0;
    background: red
}

<div class="content">
    <div class="item">...</div> <!-- первый элемент — margin: 0; -->
    <div class="item">...</div> <!-- стандартный элемент — margin: 10px 0; -->
    <div class="item">...</div> <!-- стандартный элемент — margin: 10px 0; -->
    <div class="item">...</div> <!-- последний элемент — margin: 0; -->
</div>

Answer 2

Вот так работает:

.content > .item:not(:last-of-type):not(:first-of-type) {
    margin: 0 0 0 0;
    background: red;
}

БЛОГ НА HUSL

CSS: применить стили ко всем элементам, кроме первого и последнего

Ответы (2 шт):