Menu icon Foundation
FD5 - Text Alignment Classes ???

allthough 'Text Alignment Classes' are mentioned in the docs http://foundation.zurb.com/docs/utility-classes.html - they will not be outputed - and i can't find an .scss file which contents any of the classes. (ie: medium-only-text-right)

can anyone gimme me a hint.

Text Alignment Classes

allthough 'Text Alignment Classes' are mentioned in the docs http://foundation.zurb.com/docs/utility-classes.html - they will not be outputed - and i can't find an .scss file which contents any of the classes. (ie: medium-only-text-right)

can anyone gimme me a hint.

Shoaib Iqbal over 4 years ago

Hi, they exist in the css and also in the scss files, see a working example here http://codepen.io/shoaibik/pen/vEaKRg

In the scss files, in _type.scss (near line 160) there is scss code for it:

@for $i from 1 through length($align-class-names) {
    @media #{(nth($align-class-breakpoints, $i))} {
      .#{(nth($align-class-names, $i))}-text-left { text-align: left !important; }
      .#{(nth($align-class-names, $i))}-text-right   { text-align: right !important; }
      .#{(nth($align-class-names, $i))}-text-center  { text-align: center !important; }
      .#{(nth($align-class-names, $i))}-text-justify { text-align: justify !important; }
    }
  }

Rafi Benkual over 4 years ago

That's a great answer Shoaib.

@jm - Let us know if you got it or need more guidance.