Menu
I have a megamenu that is absolutely positioned, and as some of its parent elements need to have position:relative, I have to use position:unset on the direct parent. This works in Chrome and Firefox, however IE11 does not support unset or initial.
I can't simply remove the relative positioning from all of the parent elements as that will break other things, but I have to have the megamenu absolutely positioned relative to the page (fixed position does not work). Is there an alternative to unset that will work in IE11?
482
Note how the unset property simply resets the color property of the element.
In short, there's no easy way to restore to default values to whatever a browser uses . The closest option is to use the 'initial' property value, which will restore it to the default CSS values, rather than the browser's default styles.
The initial value of a CSS property is its default value, as listed in its definition table in the specification. The usage of the initial value depends on whether a property is inherited or not: For inherited properties, the initial value is used on the root element only, as long as no specified value is supplied.
inherit : Get the property from the parent element. initial : The default value for the property (the browser default). unset : Acts as either inherit or initial. It'll act as inherit if the parent has a value that matches, or else it will act as initial.
unset means
If the cascaded value of a property is the unset keyword, then if it is an inherited property, this is treated as
inherit, and if it is not, this is treated asinitial. This keyword effectively erases all declared values occurring
In your case, position is not an inherited property so it will always consider initial
Each property has an initial value, defined in the property’s definition table.
For position, it's static So you can simply use position:static and it will behave the same as position:unset
Reference: https://drafts.csswg.org/css-cascade-3/
To make this more generic you have to either use:
property:inherit if it's an inhertied propetyproperty:<initial_value> if it's not an inhertied propety. Then you look at the property’s definition table to find the initial value.
https://developer.mozilla.org/en-US/docs/Web/CSS/position
130
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
