0

I have set the width of a container div to 700px. When I use media query to resize it lower width, the element.style sets the width to 700px. I have tried overriding it using !important, .container[style] but all in vain.

Rino Raj
  • 6,264
  • 2
  • 27
  • 42
G Pritiranjan Das
  • 55
  • 6

2 Answers2

0

The styling added through js is happening after the css is rendered. This post goes over the whole order of a page load.

If the element's styling has to be created with javascript, one possible solution is to also apply your desired 700px width with javascript too. There are a lot of options for how to do it, so it really depends on the framework, etc that you are using.

Community
  • 1
  • 1
mcrun
  • 11
  • 4
  • Thanks. I will try to change the sequence and see what happens. – G Pritiranjan Das Mar 22 '16 at 09:24
  • I can't comment on the other posts because you need 50 rep points... But you should absolutely share snippets of code on here. With this issue it would be much more helpful if you included a portion of the head for the stylesheet, the part of the body where your scripts are loaded and then the portion of the script appending the element. It would also be helpful to state which framework you are using, ex: if this were in angular there would be a very specific solution than if you were using, say, laravel. – mcrun Mar 22 '16 at 14:22
0

There is no clarity in your question. please provide necessary code base. Based on the question and the assumptions I have made small change and provides the jsbin for your understanding. visit here

Prasanth-Ramanathan
  • 74
  • 4
  • Thanks for the reply. Actually the code is quite big and it's a purchased one from a market place. So publicly I can't share it. If you want to have a look, I can share the files with you. – G Pritiranjan Das Mar 22 '16 at 09:23