0
由於某種原因,我的Joomla 3網站(使用Protostar模板)有媒體查詢,只是不工作了。具體示例位於this page。如果您在手機上查看該頁面,一旦窗口達到599像素或更少,頁面上的大型總線圖像應該「堆疊」在其下面的文本中。Joomla 3的媒體查詢不工作突然
奇怪的是,像這樣的事情正在工作,然後突然停止工作。我試圖找出沒有運氣的情況下會出現什麼問題。
這是我的CSS代碼,包括媒體查詢。我只是把它所有的template.css文件:
.bustype{width:206px;
height:296px;
border:2px solid black;
margin-right:10px;
margin-left:10px;
margin-bottom:25px;
display:inline-block;
padding:5px
}
#bustypewrap{
width:100%;
margin:auto;
text-align:center;}
.busimage{
width:45%;
margin-left:5%;
float:left}
.buscopy{
width:40%;
float:right;
text-align:justify}
.clearitall{
clear:both;}
.footerbb{
width:100%;
padding:15px;
margin-top:20px;
text-align:center;
background-color:#00467e;
color:#fff;}
.spectable{
display:block;
}
.spectablemobile{
display:none;
}
.mobilelogo{
display:none;
}
.buttonblue, .buttonblue:hover {
font-size:18px;
a{color:#fff;}
a:hover{color:#fff;}
background-color: #1d78cb;
-webkit-box-shadow: 0px 3px 0px 0px #0f3e68;
-moz-box-shadow: 0px 3px 0px 0px #0f3e68;
box-shadow: 0px 3px 0px 0px #0f3e68;
}
.mobilebanner{display:none;}
.popupimagesbuses{
float:left;
margin:10px;}
}
@media only screen and (max-device-width: 599px) {
.spectablemobile{
display:block;
}
.spectable{
display:none;
}
.busimage{
width:100%;
}
.buscopy{
width:100%;
text-align:justify}
.mobilebanner{display:block;}
#content{
padding-left:10px;
padding-right:10px;
}
body{
padding-left:0px!important;
}
}
@media only screen and (max-device-width: 979px) {
.mobilelogo{
display:block;
}
}
我只包括我加入的代碼,其餘爲從模板(原恆星)可以使用的顏色,etc-但可以修改基本的CSS就是這樣。
任何幫助,您可以提供將不勝感激!謝謝。
你是最好的。完全錯過了。 –