Z-index function for SCSS



    SASS/SCSS Starter Kit

    z-indexes is an array which contains the z-index values for the various list items. The z-index property of a list item determines where in the DOM it will be displayed.

    Shortcut: scss.function.zindex

    // this list is in descending order
    $z-indexes (
    @function z-index($name) {
      @if index($z-indexes, $name) {
        @return (length($z-indexes) - index($z-indexes, $name))+1;
      @else {
        @warn 'There is no item "#{$name}" in this list; choose one of: #{$z-indexes}';
        @return null;
    Codiga Logo
    Codiga Hub
    • Rulesets
    • Playground
    • Snippets
    • Cookbooks
    • Security
    • Privacy Policy
    • Code Privacy
    • Terms of Service
    soc-2 icon

    We are SOC-2 Compliance Certified

    G2 high performer medal

    Codiga – All rights reserved 2022.