Как показать\скрыть элементы?

Question

[eellazy]

Всем привет! Подскажите, а то уже совсем запутался.... и голова отказывается думать

Я добавил ограничение на количество показов элементов при определенном расширении экрана. Теперь хочу сделать так, что бы код (предоставлен ниже) при максимальном расширении экрана переставал работать. То есть ограничения отсутствуют, как при других расширениях.

@media only screen and (max-width: 991px){
.cat_block3 .listing-card:nth-child(n+6){
    display:none;
}
}


@media only screen and (max-width: 768px){
    .cat_block3 .listing-card:nth-child(n+5){
        display:none;
    }
    
    .cat_block1 .listing-card:nth-child(n+5){
        display:none;
        
}

    .cat_block2 .listing-card:nth-child(n+5){
        display:none;
        
}
}

Comments

[Сергей delphinpro]

"разрешение экрана", "ширина экрана". Но никак не расширение экрана. Что же такие необразованные-то...

Answer 1

[Алексей Быков]

Ну у вас же прописан max-width. При разрешениях выше display:none не будет учитываться. В чем же проблема?

Comments

[eellazy]

нужно что бы до 500px display не учитывался. Загвоздка сделать именно до 500, а не после

[Алексей Быков]

media only screen and (min-device-width: 501px) and (max-device-width: ***px) ?

[eellazy]

Алексей Быков: что-то не подходит... Элементы тогда не пропадают. Свойство nth-child перестает работать

[eellazy]

eellazy: все проблему решил.
Нужно было "media only screen and (min-width: 501px) and (max-width: ***px) " без "-device"