height.md

Height

The height CSS property specifies the height of an element. By default, the property defines the height of the content area. If box-sizing is set to border-box, however, it instead determines the height of the border area.

• .h-auto
• .hover:h-auto
• .h-5
• .hover:h-5
• .h-10
• .hover:h-10
• .h-15
• .hover:h-15
• .h-20
• .hover:h-20
• .h-25
• .hover:h-25
• .h-30
• .hover:h-30
• .h-35
• .hover:h-35
• .h-40
• .hover:h-40
• .h-45
• .hover:h-45
• .h-50
• .hover:h-50
• .h-55
• .hover:h-55
• .h-60
• .hover:h-60
• .h-65
• .hover:h-65
• .h-70
• .hover:h-70
• .h-75
• .hover:h-75
• .h-80
• .hover:h-80
• .h-85
• .hover:h-85
• .h-90
• .hover:h-90
• .h-95
• .hover:h-95
• .h-100
• .hover:h-100

.h-auto,
.hover\:h-auto:hover {
  height: auto;
}
.h-5,
.hover\:h-5:hover {
  height: 5%;
}
.h-10,
.hover\:h-10:hover {
  height: 10%;
}
.h-15,
.hover\:h-15:hover {
  height: 15%;
}
.h-20,
.hover\:h-20:hover {
  height: 20%;
}
.h-25,
.hover\:h-25:hover {
  height: 25%;
}
.h-30,
.hover\:h-30:hover {
  height: 30%;
}
.h-35,
.hover\:h-35:hover {
  height: 35%;
}
.h-40,
.hover\:h-40:hover {
  height: 40%;
}
.h-45,
.hover\:h-45:hover {
  height: 45%;
}
.h-50,
.hover\:h-50:hover {
  height: 50%;
}
.h-55,
.hover\:h-55:hover {
  height: 55%;
}
.h-60,
.hover\:h-60:hover {
  height: 60%;
}
.h-65,
.hover\:h-65:hover {
  height: 65%;
}
.h-70,
.hover\:h-70:hover {
  height: 70%;
}
.h-75,
.hover\:h-75:hover {
  height: 75%;
}
.h-80,
.hover\:h-80:hover {
  height: 80%;
}
.h-85,
.hover\:h-85:hover {
  height: 85%;
}
.h-90,
.hover\:h-90:hover {
  height: 90%;
}
.h-95,
.hover\:h-95:hover {
  height: 95%;
}
.h-100,
.hover\:h-100:hover {
  height: 100%;
}

• .h-vh-25
• .hover:h-vh-25
• .h-vh-50
• .hover:h-vh-50
• .h-vh-75
• .hover:h-vh-75
• .h-vh-100
• .hover:h-vh-100

.h-vh-25,
.hover\:h-vh-25:hover {
  height: 25vh;
}
.h-vh-50,
.hover\:h-vh-50:hover {
  height: 50vh;
}
.h-vh-75,
.hover\:h-vh-75:hover {
  height: 75vh;
}
.h-vh-100,
.hover\:h-vh-100:hover {
  height: 100vh;
}

• .h-vw-25
• .hover:h-vw-25
• .h-vw-50
• .hover:h-vw-50
• .h-vw-75
• .hover:h-vw-75
• .h-vw-100
• .hover:h-vw-100

.h-vw-25,
.hover\:h-vw-25:hover {
  height: 25vw;
}
.h-vw-50,
.hover\:h-vw-50:hover {
  height: 50vw;
}
.h-vw-75,
.hover\:h-vw-75:hover {
  height: 75vw;
}
.h-vw-100,
.hover\:h-vw-100:hover {
  height: 100vw;
}

Mobile Height

• .mobile:h-auto
• .hover:mobile:h-auto
• .mobile:h-5
• .hover:mobile:h-5
• .mobile:h-10
• .hover:mobile:h-10
• .mobile:h-15
• .hover:mobile:h-15
• .mobile:h-20
• .hover:mobile:h-20
• .mobile:h-25
• .hover:mobile:h-25
• .mobile:h-30
• .hover:mobile:h-30
• .mobile:h-35
• .hover:mobile:h-35
• .mobile:h-40
• .hover:mobile:h-40
• .mobile:h-45
• .hover:mobile:h-45
• .mobile:h-50
• .hover:mobile:h-50
• .mobile:h-55
• .hover:mobile:h-55
• .mobile:h-60
• .hover:mobile:h-60
• .mobile:h-65
• .hover:mobile:h-65
• .mobile:h-70
• .hover:mobile:h-70
• .mobile:h-75
• .hover:mobile:h-75
• .mobile:h-80
• .hover:mobile:h-80
• .mobile:h-85
• .hover:mobile:h-85
• .mobile:h-90
• .hover:mobile:h-90
• .mobile:h-95
• .hover:mobile:h-95
• .mobile:h-100
• .hover:mobile:h-100

/* mobile < 480px */
@media screen and (max-width: 480px) {
  .mobile\:h-auto,
  .hover\:mobile\:h-auto:hover {
    height: auto;
  }
  .mobile\:h-5,
  .hover\:mobile\:h-5:hover {
    height: 5%;
  }
  .mobile\:h-10,
  .hover\:mobile\:h-10:hover {
    height: 10%;
  }
  .mobile\:h-15,
  .hover\:mobile\:h-15:hover {
    height: 15%;
  }
  .mobile\:h-20,
  .hover\:mobile\:h-20:hover {
    height: 20%;
  }
  .mobile\:h-25,
  .hover\:mobile\:h-25:hover {
    height: 25%;
  }
  .mobile\:h-30,
  .hover\:mobile\:h-30:hover {
    height: 30%;
  }
  .mobile\:h-35,
  .hover\:mobile\:h-35:hover {
    height: 35%;
  }
  .mobile\:h-40,
  .hover\:mobile\:h-40:hover {
    height: 40%;
  }
  .mobile\:h-45,
  .hover\:mobile\:h-45:hover {
    height: 45%;
  }
  .mobile\:h-50,
  .hover\:mobile\:h-50:hover {
    height: 50%;
  }
  .mobile\:h-55,
  .hover\:mobile\:h-55:hover {
    height: 55%;
  }
  .mobile\:h-60,
  .hover\:mobile\:h-60:hover {
    height: 60%;
  }
  .mobile\:h-65,
  .hover\:mobile\:h-65:hover {
    height: 65%;
  }
  .mobile\:h-70,
  .hover\:mobile\:h-70:hover {
    height: 70%;
  }
  .mobile\:h-75,
  .hover\:mobile\:h-75:hover {
    height: 75%;
  }
  .mobile\:h-80,
  .hover\:mobile\:h-80:hover {
    height: 80%;
  }
  .mobile\:h-85,
  .hover\:mobile\:h-85:hover {
    height: 85%;
  }
  .mobile\:h-90,
  .hover\:mobile\:h-90:hover {
    height: 90%;
  }
  .mobile\:h-95,
  .hover\:mobile\:h-95:hover {
    height: 95%;
  }
  .mobile\:h-100,
  .hover\:mobile\:h-100:hover {
    height: 100%;
  }
}

Tablet Height

• .tablet:h-auto
• .hover:tablet:h-auto
• .tablet:h-5
• .hover:tablet:h-5
• .tablet:h-10
• .hover:tablet:h-10
• .tablet:h-15
• .hover:tablet:h-15
• .tablet:h-20
• .hover:tablet:h-20
• .tablet:h-25
• .hover:tablet:h-25
• .tablet:h-30
• .hover:tablet:h-30
• .tablet:h-35
• .hover:tablet:h-35
• .tablet:h-40
• .hover:tablet:h-40
• .tablet:h-45
• .hover:tablet:h-45
• .tablet:h-50
• .hover:tablet:h-50
• .tablet:h-55
• .hover:tablet:h-55
• .tablet:h-60
• .hover:tablet:h-60
• .tablet:h-65
• .hover:tablet:h-65
• .tablet:h-70
• .hover:tablet:h-70
• .tablet:h-75
• .hover:tablet:h-75
• .tablet:h-80
• .hover:tablet:h-80
• .tablet:h-85
• .hover:tablet:h-85
• .tablet:h-90
• .hover:tablet:h-90
• .tablet:h-95
• .hover:tablet:h-95
• .tablet:h-100
• .hover:tablet:h-100

/* tablet < 768px */
@media screen and (min-width: 480px) and (max-width: 768px) {
  .tablet\:h-auto,
  .hover\:tablet\:h-auto:hover {
    height: auto;
  }
  .tablet\:h-5,
  .hover\:tablet\:h-5:hover {
    height: 5%;
  }
  .tablet\:h-10,
  .hover\:tablet\:h-10:hover {
    height: 10%;
  }
  .tablet\:h-15,
  .hover\:tablet\:h-15:hover {
    height: 15%;
  }
  .tablet\:h-20,
  .hover\:tablet\:h-20:hover {
    height: 20%;
  }
  .tablet\:h-25,
  .hover\:tablet\:h-25:hover {
    height: 25%;
  }
  .tablet\:h-30,
  .hover\:tablet\:h-30:hover {
    height: 30%;
  }
  .tablet\:h-35,
  .hover\:tablet\:h-35:hover {
    height: 35%;
  }
  .tablet\:h-40,
  .hover\:tablet\:h-40:hover {
    height: 40%;
  }
  .tablet\:h-45,
  .hover\:tablet\:h-45:hover {
    height: 45%;
  }
  .tablet\:h-50,
  .hover\:tablet\:h-50:hover {
    height: 50%;
  }
  .tablet\:h-55,
  .hover\:tablet\:h-55:hover {
    height: 55%;
  }
  .tablet\:h-60,
  .hover\:tablet\:h-60:hover {
    height: 60%;
  }
  .tablet\:h-65,
  .hover\:tablet\:h-65:hover {
    height: 65%;
  }
  .tablet\:h-70,
  .hover\:tablet\:h-70:hover {
    height: 70%;
  }
  .tablet\:h-75,
  .hover\:tablet\:h-75:hover {
    height: 75%;
  }
  .tablet\:h-80,
  .hover\:tablet\:h-80:hover {
    height: 80%;
  }
  .tablet\:h-85,
  .hover\:tablet\:h-85:hover {
    height: 85%;
  }
  .tablet\:h-90,
  .hover\:tablet\:h-90:hover {
    height: 90%;
  }
  .tablet\:h-95,
  .hover\:tablet\:h-95:hover {
    height: 95%;
  }
  .tablet\:h-100,
  .hover\:tablet\:h-100:hover {
    height: 100%;
  }
}

Tablet Pc Height

• .tablet-pc:h-auto
• .hover:tablet-pc:h-auto
• .tablet-pc:h-5
• .hover:tablet-pc:h-5
• .tablet-pc:h-10
• .hover:tablet-pc:h-10
• .tablet-pc:h-15
• .hover:tablet-pc:h-15
• .tablet-pc:h-20
• .hover:tablet-pc:h-20
• .tablet-pc:h-25
• .hover:tablet-pc:h-25
• .tablet-pc:h-30
• .hover:tablet-pc:h-30
• .tablet-pc:h-35
• .hover:tablet-pc:h-35
• .tablet-pc:h-40
• .hover:tablet-pc:h-40
• .tablet-pc:h-45
• .hover:tablet-pc:h-45
• .tablet-pc:h-50
• .hover:tablet-pc:h-50
• .tablet-pc:h-55
• .hover:tablet-pc:h-55
• .tablet-pc:h-60
• .hover:tablet-pc:h-60
• .tablet-pc:h-65
• .hover:tablet-pc:h-65
• .tablet-pc:h-70
• .hover:tablet-pc:h-70
• .tablet-pc:h-75
• .hover:tablet-pc:h-75
• .tablet-pc:h-80
• .hover:tablet-pc:h-75
• .tablet-pc:h-85
• .hover:tablet-pc:h-85
• .tablet-pc:h-90
• .hover:tablet-pc:h-90
• .tablet-pc:h-95
• .hover:tablet-pc:h-95
• .tablet-pc:h-100
• .hover:tablet-pc:h-100

/* tablet-pc < 992 */
@media screen and (min-width: 768px) and (max-width: 992px) {
  .tablet-pc\:h-auto,
  .hover\:tablet-pc\:h-auto:hover {
    height: auto;
  }
  .tablet-pc\:h-5,
  .hover\:tablet-pc\:h-5:hover {
    height: 5%;
  }
  .tablet-pc\:h-10,
  .hover\:tablet-pc\:h-10:hover {
    height: 10%;
  }
  .tablet-pc\:h-15,
  .hover\:tablet-pc\:h-15:hover {
    height: 15%;
  }
  .tablet-pc\:h-20,
  .hover\:tablet-pc\:h-20:hover {
    height: 20%;
  }
  .tablet-pc\:h-25,
  .hover\:tablet-pc\:h-25:hover {
    height: 25%;
  }
  .tablet-pc\:h-30,
  .hover\:tablet-pc\:h-30:hover {
    height: 30%;
  }
  .tablet-pc\:h-35,
  .hover\:tablet-pc\:h-35:hover {
    height: 35%;
  }
  .tablet-pc\:h-40,
  .hover\:tablet-pc\:h-40:hover {
    height: 40%;
  }
  .tablet-pc\:h-45,
  .hover\:tablet-pc\:h-45:hover {
    height: 45%;
  }
  .tablet-pc\:h-50,
  .hover\:tablet-pc\:h-50:hover {
    height: 50%;
  }
  .tablet-pc\:h-55,
  .hover\:tablet-pc\:h-55:hover {
    height: 55%;
  }
  .tablet-pc\:h-60,
  .hover\:tablet-pc\:h-60:hover {
    height: 60%;
  }
  .tablet-pc\:h-65,
  .hover\:tablet-pc\:h-65:hover {
    height: 65%;
  }
  .tablet-pc\:h-70,
  .hover\:tablet-pc\:h-70:hover {
    height: 70%;
  }
  .tablet-pc\:h-75,
  .hover\:tablet-pc\:h-75:hover {
    height: 75%;
  }
  .tablet-pc\:h-80,
  .hover\:tablet-pc\:h-75:hover {
    height: 80%;
  }
  .tablet-pc\:h-85,
  .hover\:tablet-pc\:h-85:hover {
    height: 85%;
  }
  .tablet-pc\:h-90,
  .hover\:tablet-pc\:h-90:hover {
    height: 90%;
  }
  .tablet-pc\:h-95,
  .hover\:tablet-pc\:h-95:hover {
    height: 95%;
  }
  .tablet-pc\:h-100,
  .hover\:tablet-pc\:h-100:hover {
    height: 100%;
  }
}

Pc Height

• .pc:h-auto
• .hover:pc:h-auto
• .pc:h-5
• .hover:pc:h-5
• .pc:h-10
• .hover:pc:h-10
• .pc:h-15
• .hover:pc:h-15
• .pc:h-20
• .hover:pc:h-20
• .pc:h-25
• .hover:pc:h-25
• .pc:h-30
• .hover:pc:h-30
• .pc:h-35
• .hover:pc:h-35
• .pc:h-40
• .hover:pc:h-40
• .pc:h-45
• .hover:pc:h-45
• .pc:h-50
• .hover:pc:h-50
• .pc:h-55
• .hover:pc:h-55
• .pc:h-60
• .hover:pc:h-60
• .pc:h-65
• .hover:pc:h-65
• .pc:h-70
• .hover:pc:h-70
• .pc:h-75
• .hover:pc:h-75
• .pc:h-80
• .hover:pc:h-80
• .pc:h-85
• .hover:pc:h-85
• .pc:h-90
• .hover:pc:h-90
• .pc:h-95
• .hover:pc:h-95
• .pc:h-100
• .hover:pc:h-100

/* pc < 1200 */
@media screen and (min-width: 992px) and (max-width: 1200px) {
  .pc\:h-auto,
  .hover\:pc\:h-auto:hover {
    height: auto;
  }
  .pc\:h-5,
  .hover\:pc\:h-5:hover {
    height: 5%;
  }
  .pc\:h-10,
  .hover\:pc\:h-10:hover {
    height: 10%;
  }
  .pc\:h-15,
  .hover\:pc\:h-15:hover {
    height: 15%;
  }
  .pc\:h-20,
  .hover\:pc\:h-20:hover {
    height: 20%;
  }
  .pc\:h-25,
  .hover\:pc\:h-25:hover {
    height: 25%;
  }
  .pc\:h-30,
  .hover\:pc\:h-30:hover {
    height: 30%;
  }
  .pc\:h-35,
  .hover\:pc\:h-35:hover {
    height: 35%;
  }
  .pc\:h-40,
  .hover\:pc\:h-40:hover {
    height: 40%;
  }
  .pc\:h-45,
  .hover\:pc\:h-45:hover {
    height: 45%;
  }
  .pc\:h-50,
  .hover\:pc\:h-50:hover {
    height: 50%;
  }
  .pc\:h-55,
  .hover\:pc\:h-55:hover {
    height: 55%;
  }
  .pc\:h-60,
  .hover\:pc\:h-60:hover {
    height: 60%;
  }
  .pc\:h-65,
  .hover\:pc\:h-65:hover {
    height: 65%;
  }
  .pc\:h-70,
  .hover\:pc\:h-70:hover {
    height: 70%;
  }
  .pc\:h-75,
  .hover\:pc\:h-75:hover {
    height: 75%;
  }
  .pc\:h-80,
  .hover\:pc\:h-80:hover {
    height: 80%;
  }
  .pc\:h-85,
  .hover\:pc\:h-85:hover {
    height: 85%;
  }
  .pc\:h-90,
  .hover\:pc\:h-90:hover {
    height: 90%;
  }
  .pc\:h-95,
  .hover\:pc\:h-95:hover {
    height: 95%;
  }
  .pc\:h-100,
  .hover\:pc\:h-100:hover {
    height: 100%;
  }
}

Tv Height

• .tv:h-auto
• .hover:tv:h-auto
• .tv:h-5
• .hover:tv:h-5
• .tv:h-10
• .hover:tv:h-10
• .tv:h-15
• .hover:tv:h-15
• .tv:h-20
• .hover:tv:h-20
• .tv:h-25
• .hover:tv:h-25
• .tv:h-30
• .hover:tv:h-30
• .tv:h-35
• .hover:tv:h-35
• .tv:h-40
• .hover:tv:h-40
• .tv:h-45
• .hover:tv:h-45
• .tv:h-50
• .hover:tv:h-50
• .tv:h-55
• .hover:tv:h-55
• .tv:h-60
• .hover:tv:h-60
• .tv:h-65
• .hover:tv:h-65
• .tv:h-70
• .hover:tv:h-70
• .tv:h-75
• .hover:tv:h-75
• .tv:h-80
• .hover:tv:h-80
• .tv:h-85
• .hover:tv:h-85
• .tv:h-90
• .hover:tv:h-90
• .tv:h-95
• .hover:tv:h-95
• .tv:h-100
• .hover:tv:h-100

/* tv > 1200 */
@media screen and (min-width: 1200px) {
  .tv\:h-auto,
  .hover\:tv\:h-auto:hover {
    height: auto;
  }
  .tv\:h-5,
  .hover\:tv\:h-5:hover {
    height: 5%;
  }
  .tv\:h-10,
  .hover\:tv\:h-10:hover {
    height: 10%;
  }
  .tv\:h-15,
  .hover\:tv\:h-15:hover {
    height: 15%;
  }
  .tv\:h-20,
  .hover\:tv\:h-20 {
    height: 20%;
  }
  .tv\:h-25,
  .hover\:tv\:h-25:hover {
    height: 25%;
  }
  .tv\:h-30,
  .hover\:tv\:h-30:hover {
    height: 30%;
  }
  .tv\:h-35,
  .hover\:tv\:h-35:hover {
    height: 35%;
  }
  .tv\:h-40,
  .hover\:tv\:h-40:hover {
    height: 40%;
  }
  .tv\:h-45,
  .hover\:tv\:h-45:hover {
    height: 45%;
  }
  .tv\:h-50,
  .hover\:tv\:h-50:hover {
    height: 50%;
  }
  .tv\:h-55,
  .hover\:tv\:h-55:hover {
    height: 55%;
  }
  .tv\:h-60,
  .hover\:tv\:h-60:hover {
    height: 60%;
  }
  .tv\:h-65,
  .hover\:tv\:h-65:hover {
    height: 65%;
  }
  .tv\:h-70,
  .hover\:tv\:h-70:hover {
    height: 70%;
  }
  .tv\:h-75,
  .hover\:tv\:h-75:hover {
    height: 75%;
  }
  .tv\:h-80,
  .hover\:tv\:h-80:hover {
    height: 80%;
  }
  .tv\:h-85,
  .hover\:tv\:h-85:hover {
    height: 85%;
  }
  .tv\:h-90,
  .hover\:tv\:h-90:hover {
    height: 90%;
  }
  .tv\:h-95,
  .hover\:tv\:h-95:hover {
    height: 95%;
  }
  .tv\:h-100,
  .hover\:tv\:h-100:hover {
    height: 100%;
  }
}

Tablet Max Height

• .tablet-max:h-auto
• .hover:tablet-max:h-auto
• .tablet-max:h-5
• .hover:tablet-max:h-5
• .tablet-max:h-10
• .hover:tablet-max:h-10
• .tablet-max:h-15
• .hover:tablet-max:h-15
• .tablet-max:h-20
• .hover:tablet-max:h-20
• .tablet-max:h-25
• .hover:tablet-max:h-25
• .tablet-max:h-30
• .hover:tablet-max:h-30
• .tablet-max:h-35
• .hover:tablet-max:h-35
• .tablet-max:h-40
• .hover:tablet-max:h-40
• .tablet-max:h-45
• .hover:tablet-max:h-45
• .tablet-max:h-50
• .hover:tablet-max:h-50
• .tablet-max:h-55
• .hover:tablet-max:h-55
• .tablet-max:h-60
• .hover:tablet-max:h-60
• .tablet-max:h-65
• .hover:tablet-max:h-65
• .tablet-max:h-70
• .hover:tablet-max:h-70
• .tablet-max:h-75
• .hover:tablet-max:h-75
• .tablet-max:h-80
• .hover:tablet-max:h-80
• .tablet-max:h-85
• .hover:tablet-max:h-85
• .tablet-max:h-90
• .hover:tablet-max:h-90
• .tablet-max:h-95
• .hover:tablet-max:h-95
• .tablet-max:h-100
• .hover:tablet-max:h-100

/* tablet < 768px */
@media screen and (max-width: 768px) {
  .tablet-max\:h-auto,
  .hover\:tablet-max\:h-auto:hover {
    height: auto;
  }
  .tablet-max\:h-5,
  .hover\:tablet-max\:h-5:hover {
    height: 5%;
  }
  .tablet-max\:h-10,
  .hover\:tablet-max\:h-10:hover {
    height: 10%;
  }
  .tablet-max\:h-15,
  .hover\:tablet-max\:h-15:hover {
    height: 15%;
  }
  .tablet-max\:h-20,
  .hover\:tablet-max\:h-20:hover {
    height: 20%;
  }
  .tablet-max\:h-25,
  .hover\:tablet-max\:h-25:hover {
    height: 25%;
  }
  .tablet-max\:h-30,
  .hover\:tablet-max\:h-30:hover {
    height: 30%;
  }
  .tablet-max\:h-35,
  .hover\:tablet-max\:h-35:hover {
    height: 35%;
  }
  .tablet-max\:h-40,
  .hover\:tablet-max\:h-40:hover {
    height: 40%;
  }
  .tablet-max\:h-45,
  .hover\:tablet-max\:h-45:hover {
    height: 45%;
  }
  .tablet-max\:h-50,
  .hover\:tablet-max\:h-50:hover {
    height: 50%;
  }
  .tablet-max\:h-55,
  .hover\:tablet-max\:h-55:hover {
    height: 55%;
  }
  .tablet-max\:h-60,
  .hover\:tablet-max\:h-60:hover {
    height: 60%;
  }
  .tablet-max\:h-65,
  .hover\:tablet-max\:h-65:hover {
    height: 65%;
  }
  .tablet-max\:h-70,
  .hover\:tablet-max\:h-70:hover {
    height: 70%;
  }
  .tablet-max\:h-75,
  .hover\:tablet-max\:h-75:hover {
    height: 75%;
  }
  .tablet-max\:h-80,
  .hover\:tablet-max\:h-80:hover {
    height: 80%;
  }
  .tablet-max\:h-85,
  .hover\:tablet-max\:h-85:hover {
    height: 85%;
  }
  .tablet-max\:h-90,
  .hover\:tablet-max\:h-90:hover {
    height: 90%;
  }
  .tablet-max\:h-95,
  .hover\:tablet-max\:h-95:hover {
    height: 95%;
  }
  .tablet-max\:h-100,
  .hover\:tablet-max\:h-100:hover {
    height: 100%;
  }
}

Tablet Pc Max Height

• .tablet-pc-max:h-auto
• .hover:tablet-pc-max:h-auto
• .tablet-pc-max:h-5
• .hover:tablet-pc-max:h-5
• .tablet-pc-max:h-10
• .hover:tablet-pc-max:h-10
• .tablet-pc-max:h-15
• .hover:tablet-pc-max:h-15
• .tablet-pc-max:h-20
• .hover:tablet-pc-max:h-20
• .tablet-pc-max:h-25
• .hover:tablet-pc-max:h-25
• .tablet-pc-max:h-30
• .hover:tablet-pc-max:h-30
• .tablet-pc-max:h-35
• .hover:tablet-pc-max:h-35
• .tablet-pc-max:h-40
• .hover:tablet-pc-max:h-40
• .tablet-pc-max:h-45
• .hover:tablet-pc-max:h-45
• .tablet-pc-max:h-50
• .hover:tablet-pc-max:h-50
• .tablet-pc-max:h-55
• .hover:tablet-pc-max:h-55
• .tablet-pc-max:h-60
• .hover:tablet-pc-max:h-60
• .tablet-pc-max:h-65
• .hover:tablet-pc-max:h-65
• .tablet-pc-max:h-70
• .hover:tablet-pc-max:h-70
• .tablet-pc-max:h-75
• .hover:tablet-pc-max:h-75
• .tablet-pc-max:h-80
• .hover:tablet-pc-max:h-80
• .tablet-pc-max:h-85
• .hover:tablet-pc-max:h-85
• .tablet-pc-max:h-90
• .hover:tablet-pc-max:h-90
• .tablet-pc-max:h-95
• .hover:tablet-pc-max:h-95
• .tablet-pc-max:h-100
• .hover:tablet-pc-max:h-100

/* tablet-pc < 992 */
@media screen and (max-width: 992px) {
  .tablet-pc-max\:h-auto,
  .hover\:tablet-pc-max\:h-auto:hover {
    height: auto;
  }
  .tablet-pc-max\:h-5,
  .hover\:tablet-pc-max\:h-5:hover {
    height: 5%;
  }
  .tablet-pc-max\:h-10,
  .hover\:tablet-pc-max\:h-10:hover {
    height: 10%;
  }
  .tablet-pc-max\:h-15,
  .hover\:tablet-pc-max\:h-15:hover {
    height: 15%;
  }
  .tablet-pc-max\:h-20,
  .hover\:tablet-pc-max\:h-20:hover {
    height: 20%;
  }
  .tablet-pc-max\:h-25,
  .hover\:tablet-pc-max\:h-25:hover {
    height: 25%;
  }
  .tablet-pc-max\:h-30,
  .hover\:tablet-pc-max\:h-30:hover {
    height: 30%;
  }
  .tablet-pc-max\:h-35,
  .hover\:tablet-pc-max\:h-35:hover {
    height: 35%;
  }
  .tablet-pc-max\:h-40,
  .hover\:tablet-pc-max\:h-40:hover {
    height: 40%;
  }
  .tablet-pc-max\:h-45,
  .hover\:tablet-pc-max\:h-45:hover {
    height: 45%;
  }
  .tablet-pc-max\:h-50,
  .hover\:tablet-pc-max\:h-50:hover {
    height: 50%;
  }
  .tablet-pc-max\:h-55,
  .hover\:tablet-pc-max\:h-55:hover {
    height: 55%;
  }
  .tablet-pc-max\:h-60,
  .hover\:tablet-pc-max\:h-60:hover {
    height: 60%;
  }
  .tablet-pc-max\:h-65,
  .hover\:tablet-pc-max\:h-65:hover {
    height: 65%;
  }
  .tablet-pc-max\:h-70,
  .hover\:tablet-pc-max\:h-70:hover {
    height: 70%;
  }
  .tablet-pc-max\:h-75,
  .hover\:tablet-pc-max\:h-75:hover {
    height: 75%;
  }
  .tablet-pc-max\:h-80,
  .hover\:tablet-pc-max\:h-80:hover {
    height: 80%;
  }
  .tablet-pc-max\:h-85,
  .hover\:tablet-pc-max\:h-85:hover {
    height: 85%;
  }
  .tablet-pc-max\:h-90,
  .hover\:tablet-pc-max\:h-90:hover {
    height: 90%;
  }
  .tablet-pc-max\:h-95,
  .hover\:tablet-pc-max\:h-95:hover {
    height: 95%;
  }
  .tablet-pc-max\:h-100,
  .hover\:tablet-pc-max\:h-100:hover {
    height: 100%;
  }
}

Pc Max Height

• .pc-max:h-auto
• .hover:pc-max:h-auto
• .pc-max:h-5
• .hover:pc-max:h-5
• .pc-max:h-10
• .hover:pc-max:h-10
• .pc-max:h-15
• .hover:pc-max:h-15
• .pc-max:h-20
• .hover:pc-max:h-20
• .pc-max:h-25
• .hover:pc-max:h-25
• .pc-max:h-30
• .hover:pc-max:h-30
• .pc-max:h-35
• .hover:pc-max:h-35
• .pc-max:h-40
• .hover:pc-max:h-40
• .pc-max:h-45
• .hover:pc-max:h-45
• .pc-max:h-50
• .hover:pc-max:h-50
• .pc-max:h-55
• .hover:pc-max:h-55
• .pc-max:h-60
• .hover:pc-max:h-60
• .pc-max:h-65
• .hover:pc-max:h-65
• .pc-max:h-70
• .hover:pc-max:h-70
• .pc-max:h-75
• .hover:pc-max:h-75
• .pc-max:h-80
• .hover:pc-max:h-80
• .pc-max:h-85
• .hover:pc-max:h-85
• .pc-max:h-90
• .hover:pc-max:h-90
• .pc-max:h-95
• .hover:pc-max:h-95
• .pc-max:h-100
• .hover:pc-max:h-100

/* pc < 1200 */
@media screen and (max-width: 1200px) {
  .pc-max\:h-auto,
  .hover\:pc-max\:h-auto:hover {
    height: auto;
  }
  .pc-max\:h-5,
  .hover\:pc-max\:h-5:hover {
    height: 5%;
  }
  .pc-max\:h-10,
  .hover\:pc-max\:h-10:hover {
    height: 10%;
  }
  .pc-max\:h-15,
  .hover\:pc-max\:h-15:hover {
    height: 15%;
  }
  .pc-max\:h-20,
  .hover\:pc-max\:h-20:hover {
    height: 20%;
  }
  .pc-max\:h-25,
  .hover\:pc-max\:h-25:hover {
    height: 25%;
  }
  .pc-max\:h-30,
  .hover\:pc-max\:h-30:hover {
    height: 30%;
  }
  .pc-max\:h-35,
  .hover\:pc-max\:h-35:hover {
    height: 35%;
  }
  .pc-max\:h-40,
  .hover\:pc-max\:h-40:hover {
    height: 40%;
  }
  .pc-max\:h-45,
  .hover\:pc-max\:h-45:hover {
    height: 45%;
  }
  .pc-max\:h-50,
  .hover\:pc-max\:h-50:hover {
    height: 50%;
  }
  .pc-max\:h-55,
  .hover\:pc-max\:h-55:hover {
    height: 55%;
  }
  .pc-max\:h-60,
  .hover\:pc-max\:h-60:hover {
    height: 60%;
  }
  .pc-max\:h-65,
  .hover\:pc-max\:h-65:hover {
    height: 65%;
  }
  .pc-max\:h-70,
  .hover\:pc-max\:h-70:hover {
    height: 70%;
  }
  .pc-max\:h-75,
  .hover\:pc-max\:h-75:hover {
    height: 75%;
  }
  .pc-max\:h-80,
  .hover\:pc-max\:h-80:hover {
    height: 80%;
  }
  .pc-max\:h-85,
  .hover\:pc-max\:h-85:hover {
    height: 85%;
  }
  .pc-max\:h-90,
  .hover\:pc-max\:h-90:hover {
    height: 90%;
  }
  .pc-max\:h-95,
  .hover\:pc-max\:h-95:hover {
    height: 95%;
  }
  .pc-max\:h-100,
  .hover\:pc-max\:h-100:hover {
    height: 100%;
  }
}