Twitter bootstrap Rails 4 Bootstrap 3.3，媒体查询导致错误

我是一个新手，但我正在尝试一些我认为应该很简单的东西，但是我遇到了一个rails服务器错误。我希望我的文本可以分成多个列，用于更大的设备

我的html中有：

<div class="col">
        <p>
            Ricter Web Printing...
        </p>    
</div>

这些列工作正常，没有媒体查询。介质查询是从引导站点直接复制和粘贴的。其他引导功能工作正常，包括一个反应灵敏的导航

---

非常感谢您的帮助。

我已经可以使用了，仍然不确定我的第一个代码为什么不能使用，但我尝试了这个版本，它非常完美：

.col {
@media (min-width: 480px) {
    -webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
}
@media (min-width: 768px) {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
}
@media (min-width: 992px) {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
}
@media (min-width: 1200px) {
    -webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
}

}

---

我可能会玩我的列数和断点，但它在功能上是完美的。希望对其他人有所帮助…

提供错误的内容总是有帮助的。另外，您在发布的代码中似乎缺少了最后一个

}

。你的实际代码中缺少了吗？这将导致一个错误。不幸的是，最后的}在那里，这将是一个简单的修复。错误如下：ActionView:：Template:：error（在“…ia（最小宽度：”：预期表达式（例如1px，粗体）之后的CSS无效，为“@screen hs min”{”（in/Users/timbillington/New_Ricter_Site/RicterSite/app/assets/stylesheets/application.CSS.scss:55））：2:3:4:RicterSite 5:true%>6:true%>…好吧，这是一个打字错误。

@screen hs min

可能应该是

@screen xs min

。我尝试将hs切换为xs，但仍然给出了错误。请参阅下面的答案，了解我最终得到的结果。

.col {
@media (min-width: 480px) {
    -webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
}
@media (min-width: 768px) {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
}
@media (min-width: 992px) {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
}
@media (min-width: 1200px) {
    -webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
}