What happens if you use

<div class="show-for-medium"></div>

and

<div class="show-for-small-only"></div>

I have not tried it, but it could solve only 1 to n, it will fail with show-for-large, because show-for-small-only and show-for-medium-only should not be possible. I am confused that nobody else knows about this problem. Is there nobody else using two menus? Or is there another better way to do so?

My thought was that the "show-for-medium" (not medium-only) would satisfy medium and higher, while the "show-for-small-only" would handle only small.

Yes. But not for that one pixel that separetes small and medium in my example.

I have set

small 0,
medium 533

show-for-medium x / hide-for-medium y

i have x for 0 till 532

i have x y for 533

i have y from 534 till n