Is there any way to set a css property to the screen width?
What I want to achieve is something close to this:
div{width: screen width; }
Or
.divTest{width: screen width; }
Edit 1: I would like to use the class to exactly size other elements with the current width as i choose with css.
Edit 2: I don't believe it can be done without scripting of some sort but what do I know.
Edit 3: Final Thoughts A post about the widow re-sizing script using JavaScript is here in Alex V's answer. You'd just add in the script flavor you want. In my case it'd be setting a class property. However I believe setting visual attributes with JavaScript can be bad practice/undesirable in certain uses.
Try width: 100vw;
or as the above comment suggests, width: 100%;
.
You may also want to set the meta tag in the HTML if it applies:
<meta name="viewport" content="width=device-width, initial-scale=1">
If the <div>
isn't fitting 100% of the screen width, perhaps you need to have the default margin/padding reset:
*, :before, :after {
box-sizing: border-box; // habit
margin: 0;
padding: 0;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With