Responsive alignment classes for Zurb Foundation. Comes in handy when you need to center simple content on the small screens such as footer links.

foundation-align.scss

@mixin breakpoint($point) {
  @if $point == "medium" {
    @media (min-width: 40.063em) { @content;}
  }
  @else if $point == "large" {
    @media (min-width: 64.063em) { @content;}
  }
  @else if $point == "xlarge" {
    @media (min-width: 90.063em)  { @content;}
  }
}

.small-center {
  text-align: center;
}
.small-right {
  float: right;
}
.small-left {
  float: left;
}

@include breakpoint("medium") {
  .medium-left {
    float: left;
  }
  .medium-right {
    float: right;
  }
  .medium-center {
    text-align: center;
  }
}

@include breakpoint("large") {
  .large-left {
    float: left;
  }
  .large-right {
    float: right;
  }
  .large-center {
    text-align: center;
  }
}