Files
meanTorrent/modules/core/client/less/table-row-col.less
2017-05-19 13:08:27 +08:00

126 lines
2.2 KiB
Plaintext

@import (reference) "mt-var.less";
/**
the example url: http://www.minimit.com/demos/bootstrap-3-responsive-columns-of-same-height
**/
.row-height {
display: table;
table-layout: fixed;
height: 100%;
width: 100%;
}
.col-height {
display: table-cell;
height: 100%;
}
.col-top {
vertical-align: top;
}
.col-middle {
vertical-align: middle;
}
.col-bottom {
vertical-align: bottom;
}
@media (min-width: @screen-xs) {
.row-xs-height {
display: table;
table-layout: fixed;
height: 100%;
width: 100%;
}
.col-xs-height {
display: table-cell;
height: 100%;
}
.col-xs-top {
vertical-align: top;
}
.col-xs-middle {
vertical-align: middle;
}
.col-xs-bottom {
vertical-align: bottom;
}
}
@media (min-width: @screen-sm) {
.row-sm-height {
display: table;
table-layout: fixed;
height: 100%;
width: 100%;
}
.col-sm-height {
display: table-cell;
height: 100%;
}
.col-sm-top {
vertical-align: top;
}
.col-sm-middle {
vertical-align: middle;
}
.col-sm-bottom {
vertical-align: bottom;
}
}
@media (min-width: @screen-md) {
.row-md-height {
display: table;
table-layout: fixed;
height: 100%;
width: 100%;
}
.col-md-height {
display: table-cell;
height: 100%;
}
.col-md-top {
vertical-align: top;
}
.col-md-middle {
vertical-align: middle;
}
.col-md-bottom {
vertical-align: bottom;
}
}
@media (min-width: @screen-lg) {
.row-lg-height {
display: table;
table-layout: fixed;
height: 100%;
width: 100%;
}
.col-lg-height {
display: table-cell;
height: 100%;
}
.col-lg-top {
vertical-align: top;
}
.col-lg-middle {
vertical-align: middle;
}
.col-lg-bottom {
vertical-align: bottom;
}
}
.fill-height-table {
display: table;
table-layout: fixed;
width: 100%;
height: 100%;
}
.fill-height-row {
display: table-row;
height: auto;
}