How to apply CSS based on conditional media query?

Question

I got a WordPress page with three CTA buttons on it that need to be applied following CSS to when on resolutions of less than 576px and between 750px to 900px. Please help me understand how to write a conditional media query to apply the following CSS.

padding-left: 1rem;
padding-right: 1rem;
font-size: 1.1rem;

Answer 1

Use this queries and paste your code inside of both.

@media only screen and (max-width: 576px)  {...}
@media only screen and (min-width: 750px) and (max-width: 900px)  {...}