在small-12类上添加text-align：center的问题

Question

我在客户website上遇到了麻烦。

在标题中，我有他们的地址和社交媒体图标。一切都是他们想要的方式，直到宽度开始缩小到更多的移动视图。当小12网格大小开始时，我一直在尝试将.social和.address的文本对齐从右到中更改。但是，对于我所有的努力，它要么保持一个或另一个并且没有＆ #39; t在网格系统切换时切换。

我目前已经删除了我的工作，希望有人可以帮助我提供更好的实施方法。

Answer 1

您可以使用媒体查询。在这里查看它们 - https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

将以下CSS样式添加到您的网站（在app.css文件中或您在目标页面中包含的任何其他文件中。）

.social-icons{
    float:right;
}

@media (max-width: 600px) {
  .social-icons {
    float: left;
  }
}

默认情况下，上面的CSS会将类.social-icons的任何元素浮动到右边。 如果在屏幕宽度小于600像素的媒体屏幕上查看网站，则将其向左浮动。