在不同视图上对齐按钮

Question

我有一个按钮，我想在桌面右侧对齐，right实用程序类很容易：

<div class="small-12 columns">
  <a href="#" class="button right">bla</a>
</div>

但是在智能手机上我希望按钮不向右浮动，那么我该如何实现呢？ 基本上它只是没有使用right类，但我需要桌面...

Answer 1

您可以添加自定义类按钮使用媒体查询在智能手机/

上设置样式

HTML：

<div class="small-12 columns">
  <a href="#" class="button right mybutton">bla</a>
</div>

CSS：

@media only screen and (max-width: 40em) {
  .mybutton{
    float:none !important;
  }
}