CODEWITHSUNDEEP
cssmedia-queries
ihormillion
ihormillion

Reputation: 84

css "if has" class, use other media queries

I have a media queries for site:

from 580 - smartphones from 580 to 930 - tablets from 930 - desktops

But one page has another media queries:

from 670 - smartphones from 670 to 930 - tablets from 930 - desktops

How can I do it, if a has class "cart-page" use this media queries or if it hasn't use another.

I don't want to copy past my styles.

Upvotes: 0

Views: 2304

Answers (1)

vsync
vsync

Reputation: 130155

there is no if check in CSS. You would have to use the classes inside the same media query to differentiate between the two (or more) modes. it's better to give the whole wrapper element a class for each mode. for example, you could give the body tag or better, the html tag a class which represent something else for each category of your choosing, and with that you could work down the selectors.

In your case, you could give a class to all pages, and replace it with a specific class to that special page of yours, and work with that.

Example

@media screen and(max-width:580px){
    .allPages a{ color:green; }
}

@media screen and(max-width:670px){
    .specialPage a{ color:red; }
}

Upvotes: 1

Related Questions