css - 显示：使用@media 没有按预期工作

Question

桌面 移动

我有两种形式，其中包括一个搜索框。

1. 桌面搜索
2. 移动搜索

我的计划是让搜索框向下移动到它自己的行中。我在桌面上隐藏一个并显示另一个，反之亦然。

桌面搜索显示宽度大于 765 像素，并按计划消失。

但是，无论宽度如何，移动搜索始终存在。

    @media screen and (max-width: 765px) {
      .desktop-search {
        display: none;
      }
    }

    @media screen and (min-width: 766px) {
      .mobile-search {
        display: none;
      }
    }

标签： cssresponsive