元数据无法选择CSS媒体查询的问题

Question

我网站的移动版和平板电脑版是桌面网站的缩小版。 对于移动版本，固定的导航栏和slidetoggle导航开始起作用。

这一切都工作了一年，直到一个月前，似乎还没有发现较小的设备尺寸，我无法弄清楚出了什么问题。 在移动版本上，网站内容压缩到左侧。 通常，我可以通过更改CSS声明来解决此问题，但是我现在所做的任何更改似乎都没有效果。

我已经通过各种代码检查器运行了我的代码，但是都没有发现任何重大错误。

这是我的元数据：

<!DOCTYPE html>
<html <?php language_attributes(); ?> >

<head>
<title>MISSNISAA</title>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, maximum-scale=1.0">       
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="HandheldFriendly" content="true">   
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<link href="http://allfont.net/allfont.css?fonts=montserrat-light" rel="stylesheet" type="text/css" />
<script src="https://use.typekit.net/rsg8obz.js"></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;   
i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new    
Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;   
m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com   
/analytics.js','ga');

ga('create', 'UA-64074269-1', 'auto');
ga('send', 'pageview');

</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

<script type="text/javascript">
jQuery(document).ready(function($) {

/*prepend menu nav icon*/
$("#menu-nav").prepend("<div id='menu-nav-icon'>&#9776</div>");

/*toggle nav*/
$("#menu-nav-icon").on("click", function() {
$(".menu-nav").slideToggle();
$(this).toggleClass("active");
});

});
</script>

<script type="text/javascript">
jQuery(document).ready(function($) {

/*prepend menu social icon*/
$("#menu-social").prepend("<div id='menu-social-icon'>&#9776</div>");

/*toggle social*/
$("#menu-social-icon").on("click", function() {
$(".menu-social").slideToggle();
$(this).toggleClass("active");
});

});
</script>

</head>

感谢您的帮助，因为我为此遇到了困难。

只是添加第一张照片 是我的网站过去在移动版本上的外观，但现在看起来像第二张照片 。 在这段时间内，我没有对CSS进行任何更改，因此我看不到为什么媒体查询突然不起作用。