-1

How to change style css value using javascript?

If you change the css style using javascript, then the style will be added to the general css style. See image below. Question: how to add or change style in media screen?

enter image description here

New York is my city
  • 1
  • 4
  • Are you trying to modify the actual CSS file itself? Something else? This sounds like the makings of an XY Problem. Can you elaborate on what you’re actually trying to accomplish and why? – David Aug 27 '23 at 14:37
  • There may be some confusion about what element.style.display does in JavaScript. It is changing the style attribute of an element. It is not changing anything in a stylesheet. – A Haworth Aug 27 '23 at 14:50
  • Just to clarify: are you trying to change the display value of a particular element or are you trying to change the value in a stylesheet? – A Haworth Aug 27 '23 at 15:00

2 Answers2

0

Solution 1

Try to give it !important to be

el.style.setProperty("display", "block !important")

Solution 2

First, set the display to a variable:

.div2 {
  --display: none;
  display: var(--display);
}

el.style.setProperty("--display", "block");
Osama Mohammed
  • 28
  • 4
0

You need to check the device width.

const width = window.innerWidth || document.documentElement.clientWidth ||document.body.clientWidth;
(width > 500) ? el.style.setProperty("display", "block !important") : el.style.setProperty("display", "none !important")
wpmarts
  • 532
  • 6
  • 8