
//
// Cassetto center.
//

@mixin vertical-center {
  display: flex;
  align-items: center;
}

@mixin vertical-center {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

@mixin vertical-center($child) {
  display: table;

  #{$child} {
    display: table-cell;
    vertical-align: middle;
  }
}

@mixin center {
  display: flex;
  align-items: center;
  justify-content: center;
}

@mixin center($child) {
  display: flex;

  #{$child} {
    margin: auto;
  }
}


//
// Cassetto center.
//

@mixin vertical-center {
  display: flex;
  align-items: center;
}

@mixin vertical-center {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

@mixin vertical-center($child) {
  display: table;

  #{$child} {
    display: table-cell;
    vertical-align: middle;
  }
}

@mixin center {
  display: flex;
  align-items: center;
  justify-content: center;
}

@mixin center($child) {
  display: flex;

  #{$child} {
    margin: auto;
  }
}

@mixin center() {
  display: grid;
  grid: auto/50%;
  place-content: center;
}

Add yet another centering thechnic
Add yet another centering thechnic
