CODEWITHSUNDEEP
htmlcssmedia-queries
user2711926
user2711926

Reputation:

Reset CSS in a media query

Lets say I have a media query.. 

@media only screen and (min-width: 960px) {
 /*STYLE HERE */
}

Is it possible to reset the CSS within this media query so that none of the elements in it receive styling from the default stylesheet?

Help would definitely be appreciated!!

Upvotes: 3

Views: 5136

Answers (1)

veksen
veksen

Reputation: 7003

If you want to achieve such a thing, load stylesheets with queries :

<link rel='stylesheet' media='screen and (max-width: 959x)' href='mobile.css' />
<link rel='stylesheet' media='screen and (min-width: 960px)' href='desktop.css' />

I don't recommend that you have two different stylesheet with repeated style/layout, as it will become very hard to manage in a larger project.

Instead I suggest going with a mobile first main stylesheet (or query) where you apply basic mobile layout, color and style etc. You then code the layout for the rest of the sheets/queries (tablet->desktop). Most of the time going up a query will require simple columns adjustment and some padding/margin, font size etc, so most of your main styling is used everywhere.

Upvotes: 3

Related Questions