Question

因此我的媒体查询中的某些内容被破坏但我不知道它可能是什么。在任何大小/格式480px以上，链接工作，可点击，并且很好。当它调整为480px或更低时，链接就会停止激活。

我不知道我的媒体查询的哪个部分打破了链接...任何帮助都将不胜感激!!

导航工作中的链接，所以我不认为是这样，但主要内容页面上的链接停止工作。

内容页面的CSS：

#content {
float:left;
width:auto;
background:transparent;
padding:0 50px 0 0;
margin: 100px 0 0 160px;
}

#content p {
font-size:0.82em;
text-align:justify;
padding: 0 0 0 0;
max-width: 500px;
}

#content a {
color: rgba(102, 102, 102, 0.9);
}


#social li {
display: inline;
padding: 15px 5px 0 0;
}

对媒体查询所做的更改：

#content {
width:auto;
position:absolute;
top: 155px;
background:transparent;
padding:0 15px 0 15px;
margin: 0 0 0 0;
}

#content p {
font-size:0.79em;
}

我不知道它是如何破裂的！帮助

Answer 1

您的#navpage有min-height: 630px和z-index: 3。所以它比内容更长，并且坐在它上面。

你可以通过覆盖媒体查询的z-index来实际修复它：

#navpage {
  height: 150px;
  position: relative;
  width:auto;
  top: 0; 
  z-index: auto /* ADDED */
}

<强> Demo

但是你也可能想要覆盖那个最小高度（在媒体查询上）因为你得到一个有很多空间的滚动条。 min-height: 0;

链接在480px后停止工作

1 个答案: