媒体查询在我的 HTML 代码中不起作用，不确定我在这里做错了什么答案

【问题标题】：Media Queries not working in my HTML code, Not sure what I am doing wrong here媒体查询在我的 HTML 代码中不起作用，不确定我在这里做错了什么
【发布时间】：2016-07-04 22:06:00
【问题描述】：

这是我在网站上快速点击的代码。

网址：www.vegastoothdr.com/wp_site/

<body>
<div id="wpadminbar" style="background-color: black; padding-top: 0px;border-color: white;">
      <span class="row" style="vertical-align: top">

        <!-- PHONE ICON -->   
        <a href="tel:(702) 473-5100">
        <img class="icons" src="http://www.vegastoothdr.com/wp_site/wp-content/uploads/2016/03/phone.png" width="60" height="36" style="padding-left: 20px">
        </a>

        <!-- CALENDAR ICON -->  
        <a href="appointment">
        <img class="icons" src="http://www.vegastoothdr.com/wp_site/wp-content/uploads/2016/03/calendar.png" width="60" height="36" style="padding-left: 20px">
        </a>

        <!-- EMAIL ICON -->   
        <a href="contact">
        <img class="icons" src="http://www.vegastoothdr.com/wp_site/wp-content/uploads/2016/03/envelope.png" width="67" height="36" style="padding-left: 20px">
        </a>

        <!-- PIN ICON -->     
        <a href="https://www.google.com/maps/place/1070+W+Horizon+Ridge+Pkwy+%23121,+Henderson,+NV+89012,+USA/@36.022368,-115.0346407,17z/data=!3m1!4b1!4m2!3m1!1s0x80c8d16f85764fa7:0x702e5efb00bd1ffb">
        <img class="icons" src="http://www.vegastoothdr.com/wp_site/wp-content/uploads/2016/03/pin.png" width="49" height="36" style="padding-left: 20px">
        </a>

      </span>
    </div>
<header>
<!-- Nav CODE -->
</header>

好的，现在我有了代码，我在<head>section 的最后一行放置了一个 CSS 代码

@media screen and (max-width: 782px) 
    {

      div#wpadminbar 
        {

          height: 55px;
          min-width: 300px;
        }
    }

好的...现在可以在移动设备上使用。

但是，链接不起作用。所以我不能点击图标。所有链接都不起作用。

测试二：

我将它放在标题部分下并且链接有效。但媒体查询不起作用。好诡异。

我已将代码放在下面链接有效但媒体查询无效的位置。

<body>

<header>
  <div id="wpadminbar" style="background-color: black; padding-top: 0px;border-color: white;">
  <span class="row" style="vertical-align: top">

    <!-- PHONE ICON -->   
    <a href="tel:(702) 473-5100">
    <img class="icons" src="http://www.vegastoothdr.com/wp_site/wp-content/uploads/2016/03/phone.png" width="60" height="36" style="padding-left: 20px">
    </a>

    <!-- CALENDAR ICON -->  
    <a href="appointment">
    <img class="icons" src="http://www.vegastoothdr.com/wp_site/wp-content/uploads/2016/03/calendar.png" width="60" height="36" style="padding-left: 20px">
    </a>

    <!-- EMAIL ICON -->   
    <a href="contact">
    <img class="icons" src="http://www.vegastoothdr.com/wp_site/wp-content/uploads/2016/03/envelope.png" width="67" height="36" style="padding-left: 20px">
    </a>

    <!-- PIN ICON -->     
    <a href="https://www.google.com/maps/place/1070+W+Horizon+Ridge+Pkwy+%23121,+Henderson,+NV+89012,+USA/@36.022368,-115.0346407,17z/data=!3m1!4b1!4m2!3m1!1s0x80c8d16f85764fa7:0x702e5efb00bd1ffb">
    <img class="icons" src="http://www.vegastoothdr.com/wp_site/wp-content/uploads/2016/03/pin.png" width="49" height="36" style="padding-left: 20px">
    </a>

  </span>
</div>

【问题讨论】：

你的标题是固定位置

标签： css wordpress html media-queries

【解决方案1】：

我解决了这个问题，有一个 JS 脚本正在为视频添加一个 Div。似乎 DIV 位于我的代码之上。

我删除了它并修复了它:)

网站链接：http://www.vegastoothdr.com/

【讨论】：