Html 为什么不'；我的媒体提问没有回应吗？

我很难让我的媒体休息时间按预期工作。我希望得到与Bootstrap的网格系统类似的结果，如下所示：

• 第一种情况：宽度等于或大于992px时：
  包含不同段落的三个相同col-4类型列

• 第二种情况：当宽度介于768px和991px之间时：
  两个相同的col-6柱，第三个是col-12型柱（明显低于两个）

• 第三种情况：当宽度等于或小于767px时：
  三根相同的col-12型柱一根叠在另一根上

我在工作中遇到的麻烦比我应该遇到的要多，但我不知道我到底出了什么问题

这是我的密码

我们的菜单
/***基本样式***/
* {
框大小：边框框；
}
身体{
字体系列：“Sansita”，无衬线；
字母间距：1.5px；
背景颜色：米色；
}
.餐厅{
利润率：0.20px 0.20px；
}
h1{
字体大小：50px；
文本对齐：居中；
边缘底部：70像素；
边缘顶部：60像素；
}
氢{
字体大小：25px；
文本对齐：居中；
边框：2件纯黑；
垫底：3件；
宽度：180px；
}
p{
填充：35px 10px 10px 10px；
}
#meal1，
#meal2，
#米{
背景颜色：卡其色；
边框：2件纯黑；
边缘底部：20px；
}
meal1先生{
背景色：#F4C2C2；
}
.meal2{
背景色：#B22222；
}
.meal3{
背景颜色：灰色；
}
@介质（最小宽度：992px）{
#米1{
宽度：32%；
浮动：左；
右边距：25px；
}
#meal2{
宽度：32%；
浮动：左；
}
#米{
宽度：32%；
浮动：左；
左边距：25px；
}
}
/***平板电脑样式***/
@介质（最小宽度：768）和（最大宽度：991px）{
#米1{
宽度：48.46%；
浮动：左；
右边距：10px；
边缘底部：20px；
}
#meal2{
宽度：48.46%；
浮动：左；
左边距：10px；
边缘底部：20px；
}
#米{
宽度：100%；
浮动：左；
}
}
/***移动风格***/
@介质（最大宽度：767）{
#meal1，
#meal2，
#米{
宽度：100%；
}
}
我们的菜单
熏鱼
Lorem ipsum dolor sit amet，是一位杰出的献身者。这是一句名言，是一种习惯。虎皮猫、阿库姆萨、非马萨威尼斯人。莫里斯·埃吉特·尼西·佩伦茨克、卢克图斯·夸姆·阿甘、拉齐尼亚·奥古斯

辣味可乐
Lorem ipsum dolor sit amet，是一位杰出的献身者。这是一句名言，是一种习惯。虎皮猫、阿库姆萨、非马萨威尼斯人。莫里斯·埃吉特·尼西·佩伦茨克、卢克图斯·夸姆·阿甘、拉齐尼亚·奥古斯

萨尔达弗雷戈拉酒店
Lorem ipsum dolor sit amet，是一位杰出的献身者。这是一句名言，是一种习惯。虎皮猫、阿库姆萨、非马萨威尼斯人。莫里斯·埃吉特·尼西·佩伦茨克、卢克图斯·夸姆·阿甘、拉齐尼亚·奥古斯

使用。您的CSS中有机器可检测的错误

您已经多次（尽管不是普遍）指定了不带单位的非零长度。这将使CSS无效，因此将忽略它。

使用。您的CSS中有机器可检测的错误

---

您已经多次（尽管不是普遍）指定了不带单位的非零长度。这使得CSS无效，因此将被忽略。

哦，该死的。我到底是怎么错过的？现在我明白了验证器的重要性。谢谢你，昆汀！哦，该死的。我到底是怎么错过的？现在我明白了验证器的重要性。谢谢你，昆汀！

@media (min-width: 768) and (max-width: 991px) {