What is the correct way to specify media queries of the format "Min-width - max-width"?

Question

css

Tell me how to correctly set the media query format with a minimum and maximum width?
There is an action action block . On desktop, the block width is 41%. But when I start specifying the width for

@media (min-width : 320px) and (max-width : 380px) {}

- the style is applied not only for this format, but in general for all versions.

Answer 1

You

.blog-action .blog_inner .item {
    width: 41%;
}

and in the media, the
.blog .item
specificity in the first case is higher and they interrupt everything else.
Read about BEM naming.
Avoid nesting selectors (more than 2 is rarely required, and BEM is not nested at all).

Answer 2

@media screen and (min-width:320px) and (max-width:380px){ // code}

offtopic

Но если у вас ширина 41% и это ничем не обусловлено, то видимо вы немножко не так сверстали элемент. Обычно секция занимает 100% и сама подстраивается под экран.