我正在创建一个在无序列表中带有导航的网页。
在 iPhone 或 iPad 上,我单击链接但没有任何反应。我“触摸”链接,只是为了改变背景颜色而没有任何反应。激活链接的唯一方法是将链接保持几秒钟以显示默认的 iOS 选项,即“在新窗口中打开”。网站上还有其他可以正常工作的链接和导航。正是这一组链接给我带来了麻烦。
您能在 HTML 或 CSS 中看到任何可能导致此问题的内容吗?
这与应用于列表项的淡入淡出有关吗?
请参阅底部的标记。(我已经删除了一些东西,比如文本/背景样式类,因为它可能与问题无关。)
HTML
<ul class="list">
<li>
<a class="example" href="#">
<i class="icon-medium icon-map"></i>
<p><strong>Example description goes here</p>
</a>
</li>
<li>
<a class="example" href="#">
<i class="icon-medium icon-map"></i>
<p><strong>Example description goes here</p>
</a>
</li>
CSS
.list ul { list-style-type:none; padding:0px; margin:0px; }
.list ul li { display:block; float:left; width:50%; min-height:100px; position:relative; transition: .2s ease-in-out; -moz-transition: .2s ease-in-out; -webkit-transition: .2s ease-in-out; }
.list ul li a.example { display:block; width:100%; height:100px; }
.list ul li:hover, .list ul li:active { color:#FFF; }