I have a mobile site with fancybox popups
I'm having problems with close button:
<a title="Close" class="fancybox-item fancybox-close" href="javascript:void(0);" id="fancyboxCloseButton"><i class="icon-remove"></i></a>
On Nexus 7 tablet with Android 4.4.4 I see the close button (X) with green color:
.fancybox-close {
position: absolute;
top: .5%;
right: 2%;
display: block;
cursor: pointer;
z-index: 8040;
background: none!important;
font-size: 150%;
color: #afd732!important;
text-decoration: none;
}
But on Samsung tablet with Android 3.1 I see green holo square.
Since it impossible to debug Android 3.1 browser.
Any ideas what it can be?
It was a font issue. Android none Chrome browser doesn't support .woff font.
I added svg font and that solved the problem.
The fancybox works fine in Android browser.