Simple z-index
A while back I came across some nice z-index articles. When using a z-index I mostly give it a high value. But what if we have a couple of z-indexes with high values…
With the following code it’s possible to have a good overview of all the elements which will be using a z-index.
$z-index: (
modal : 200,
share : 150,
navigation : 100,
footer : 90,
);
@function z-index($key) {
@return map-get($z-index, $key);
}
@mixin z-index($key) {
z-index: z-index($key);
}
Check out this example where the second div has got the highest z-index:
See the Pen xxEyqLY by Mick (@mickvandijk) on CodePen.