Skip to content

Instantly share code, notes, and snippets.

@gorobey
Forked from ohryan/responsive-align.less
Created June 15, 2017 08:43
Show Gist options
  • Save gorobey/5eff2f84073d046d6d6433335c4ea8c6 to your computer and use it in GitHub Desktop.
Save gorobey/5eff2f84073d046d6d6433335c4ea8c6 to your computer and use it in GitHub Desktop.
Bootstrap 3 Responsive Text Align
.text-xs-left { text-align: left; }
.text-xs-right { text-align: right; }
.text-xs-center { text-align: center; }
.text-xs-justify { text-align: justify; }
@media (min-width: @screen-sm-min) {
.text-sm-left { text-align: left; }
.text-sm-right { text-align: right; }
.text-sm-center { text-align: center; }
.text-sm-justify { text-align: justify; }
}
@media (min-width: @screen-md-min) {
.text-md-left { text-align: left; }
.text-md-right { text-align: right; }
.text-md-center { text-align: center; }
.text-md-justify { text-align: justify; }
}
@media (min-width: @screen-lg-min) {
.text-lg-left { text-align: left; }
.text-lg-right { text-align: right; }
.text-lg-center { text-align: center; }
.text-lg-justify { text-align: justify; }
}
// For SASS
// .text-xs-left { text-align: left; }
// .text-xs-right { text-align: right; }
// .text-xs-center { text-align: center; }
// .text-xs-justify { text-align: justify; }
// @media (min-width: $screen-sm-min) {
// .text-sm-left { text-align: left; }
// .text-sm-right { text-align: right; }
// .text-sm-center { text-align: center; }
// .text-sm-justify { text-align: justify; }
// }
// @media (min-width: $screen-md-min) {
// .text-md-left { text-align: left; }
// .text-md-right { text-align: right; }
// .text-md-center { text-align: center; }
// .text-md-justify { text-align: justify; }
// }
//@media (min-width: $screen-lg-min) {
// .text-lg-left { text-align: left; }
// .text-lg-right { text-align: right; }
// .text-lg-center { text-align: center; }
// .text-lg-justify { text-align: justify; }
//}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment