liser/build/liser.utilities.css

functional css help to optimizing design work and building responsive websites

/* Equivalent to .overflow-y-scroll */
.overflow-container { overflow-y: scroll; }
.center { margin-right: auto; margin-left: auto; }
.center-box { margin: 0 auto; }
.mr-auto { margin-right: auto; }
.ml-auto { margin-left: auto; }
@media screen and (min-width: 30em) {
 .center-ns { margin-right: auto; margin-left: auto; }
 .center-box-ns { margin: 0 auto; }
 .mr-auto-ns { margin-right: auto; }
 .ml-auto-ns { margin-left: auto; }
}
@media screen and (min-width: 30em) and (max-width: 60em) {
 .center-m { margin-right: auto; margin-left: auto; }
 .center-box-m { margin: 0 auto; }
 .mr-auto-m { margin-right: auto; }
 .ml-auto-m { margin-left: auto; }
}
@media screen and (max-width: 60em) and (orientation: landscape) {
 .center-ml { margin-right: auto; margin-left: auto; }
 .center-box-ml { margin: 0 auto; }
 .mr-auto-ml { margin-right: auto; }
 .ml-auto-ml { margin-left: auto; }
}
@media screen and (min-width: 60em) {
 .center-l { margin-right: auto; margin-left: auto; }
 .center-box-l { margin: 0 auto; }
 .mr-auto-l { margin-right: auto; }
 .ml-auto-l { margin-left: auto; }
}