I have a div that I want to set the height of to 1/2 the height of another div. Is there a way I can say something like height: 50% of height of divid1;
This is a collection of methods which give you the ability to query the stylesheets collection in a document, add and remove rules, and dynamically create new sheets.
The basics. To declare a variable in CSS, come up with a name for the variable, then append two hyphens (–) as the prefix. The element here refers to any valid HTML element that has access to this CSS file. The variable name is bg-color , and two hyphens are appended.
color = "red"; you can apply the style change dynamically. Below is a function that turns an element's colour to red when you pass it the element's id . You could also use setAttribute(key, value) to set a style on an element. For example, you could set the colour of an element to red by calling element.
First of all: CSS variables can have a global or local scope. Global variables can be accessed/used through the entire document, while local variables can be used only inside the selector where it is declared.
With plain CSS there is no way you can do this. You'll have to use e.g. JavaScript to accomplish this.
One method is to use Javascript:
document.getElementById('divid2').height = Math.floor(document.getElementById('divid1').height/2);
Or calculate half of the height of divid1 if the value is static.
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