css - 尽管使用了媒体查询，为什么我的网站在移动浏览器中看起来很乱？

Question

我正在使用媒体查询来使我的网站响应不同的屏幕尺寸。问题是我在手机、笔记本电脑上的 chrome 开发工具和移动屏幕尺寸模拟器网站上得到了不同的结果！

他们不应该看起来都一样吗？

PS：我查看此网站以查看我的网站在不同屏幕尺寸上的外观： http ://whatismyscreenresolution.net/multi-screen-test

但我在那里看到的，与我在手机上浏览网站时实际得到的不同！

@media screen and (min-width: 360px) {
#cards_right_column {
    width: 69.3vw;
    height: 4.3vh;
    top: -21.8vh;
    right: 56.1vw;
    font-size: 1em;
    transform: rotate(-90deg);
}
#cards_left_column  {
    position: relative;
    top: -4.75vh;
    right: 1vw;
    width: 95.5vw;
    height: 46.4vh;
}

标签： cssbrowsermedia-queriesresponsive