数据过滤器无法在移动设备或平板电脑中正确显示标签

这是我的第一篇文章，请保持好心情。我一直在努力让这个数据过滤器在移动和平板电脑格式中正常工作。数据过滤器无法在移动设备或平板电脑中正确显示标签

themovingpicture组织AU /（抱歉不能发布超过2个链接和图片都是重要的解释问题）

一切看起来完美的台式机和铬的一切调整停留，因为它应该和标签出现存档然而在移动时，我所得到的只是一个灰色块。我已经确定能在移动出现在我的layout.css中被

.portfolio-wrapper { 
    overflow:hidden; 
    position: relative !important; 
    background: #666; 
    cursor:pointer; 
} 

#filters li span { 
    display: block; 
    padding:5px 20px; 
    text-decoration:none; 
    color:#666; 
    cursor: pointer; 
}

我最初得到了这里的代码灰色块：

创建过滤简单的响应投资组合，和悬停效果。

我试着删除和编辑的部分（如删除媒体查询，删除normal.css等）的CSS的，但只是无法弄清楚如何使它在手机和平板电脑上的桌面显示的相同方式。

我下面示出了相同的代码附加的两个图像被显示在桌面在Chrome与显示在Safari在iPhone 6

来源

2017-05-05 Skepzi

什么是你的问题？你试图解决的问题究竟是什么？ –

已添加图像示例来解释问题。 – Skepzi

使您的代码jsfiddle –

这似乎是在屏幕因为iPhone6拥有一个更大的屏幕，然后在桌面和浏览器上进行测试就可以识别为Tablet屏幕。此外，看起来你已经把你的标签设置在一些媒体查询块中。

您可以通过您的标签格式全局的（不是里面的媒体查询块），并改变你的媒体查询值使您的小屏幕更加大，那么你其他小屏幕解决它。

例：

/*Bootstrap's default small screen minimum size*/ 
@media (min-width: 655px) { 
... 
}

您可以更改此值，以使平板手机被识别为普通的智能手机。

/*Value changed*/ 
@media (min-width: 820px) { 
... 
}

来源

2017-05-05 13:58:34

数据过滤器无法在移动设备或平板电脑中正确显示标签

回答

相关问题