如何正确使用@media查询？

Question

我目前的网站布局：Screenshot 1

我使用带有包装ID的div来使网站居中：

#wrap {
width: 70%;
margin: 0 auto; 
}

但现在它显然也使得它在移动设备上的宽度为70％，看起来很糟糕：SC2

我确实尝试过使用媒体查询，一个是自己指定的max-device-width，也是CSS部分下的bootstrap网站上的那些查询，每当我使用其中任何一个删除原来的#wrap css代码时但是没有任何工作，我的网站只会在所有设备上100％，即使我在移动设备上做了70％（只是作为测试），它仍然是无处不在，就像没有css代码完全包装id。

很抱歉，如果这是一个愚蠢的问题，我只是迷失了，并且真的想让我的网站在某个（平板电脑 - 手机）断点上100％。

Answer 1

试试这个： -

@media (min-width: 768px)  {
    .mymenu {
      width: 20%;
    }
}