CODEWITHSUNDEEP
javascriptcss
Henry
Henry

Reputation: 1065

Help with CSS + Media Queries + element style

Can some CSS ninja please verify if my thought process is right or wrong.

I have a project with media queries settings css depending on if device is landscape or portrait. If my css sets width of an element to 500px and I modify that width to let say 600px, the element style is modified.

When the device changes orientation - the element style stays at 600px regardless of what my css file is set. Because the element style is higher hierarchy than styling from a css file.

What I need to do is set that element.style('width')='' to more or less erase it.

Am I right? is there a way to get the css file to always override the element style?

Thanks!

Upvotes: 0

Views: 860

Answers (1)

Stuart Burrows
Stuart Burrows

Reputation: 10814

If you use the !important declaration in a css file it will overwrite any inline styles. So in the example below the width of the div will be 400px.

.example {
    width:400px !important;
}

<div class="example" style="width:600px"></div>

Not sure why you are allowing a user to modify a width though - seems like you'll always get into an undesirable situation. But whatever, this should work :)

Upvotes: 3

Related Questions