I have a problem with RWD, when the "media screen" applied, the css inline style will not be affected. What if i want to change the inline style, i have to use the javascript ? that means javascript callback after the "media screen" ?
Hi cnwtx,
I don't think this is a good solution.
"!important" will take effect forever, then other "media" for the same css property will not take effect
Instead of using !important you should just avoid using any inline styling at all. If you need to add styling via Javascript, then you should add a class and enter the corresponding styles in your CSS file.
Those are really going to be your only (good practice) choices. Either use !important, or don't use inline. Like he said above, you should be using JS to add a class, than use the css in a css file to change the actual style on the element.
sometimes, we need to change the css property dynamically, let's say using jQuery' css() function which will update the inline style
Could you give an example of a situation where this would be preferable to just changing a class? The latter is simpler, more readable and easier code to maintain or modify. I simply don't believe the quoted statement to be true.
Could you post a codepen or similar? My feeling is that most problems of this sort can be resolved by reformulating your approach to the original task. In some ways it is reminiscent of the chocolate coated banana, where understanding your goal is more beneficial than producing an answer to your original question.
Hi Everyone,
I have a problem with RWD, when the "media screen" applied, the css inline style will not be affected. What if i want to change the inline style, i have to use the javascript ? that means javascript callback after the "media screen" ?
Try adding an
!importantto the rule in your css file. That should make it override the inline rule.Hi cnwtx, I don't think this is a good solution. "!important" will take effect forever, then other "media" for the same css property will not take effect
Instead of using
!importantyou should just avoid using any inline styling at all. If you need to add styling via Javascript, then you should add a class and enter the corresponding styles in your CSS file.sometimes, we need to change the css property dynamically, let's say using jQuery' css() function which will update the inline style
Those are really going to be your only (good practice) choices. Either use !important, or don't use inline. Like he said above, you should be using JS to add a class, than use the css in a css file to change the actual style on the element.
Could you give an example of a situation where this would be preferable to just changing a class? The latter is simpler, more readable and easier code to maintain or modify. I simply don't believe the quoted statement to be true.
The only time you'd need to use an inline style is if you're calculating some sort of math or doing an animation.
yeah, what should I do then ?
Could you post a codepen or similar? My feeling is that most problems of this sort can be resolved by reformulating your approach to the original task. In some ways it is reminiscent of the chocolate coated banana, where understanding your goal is more beneficial than producing an answer to your original question.