I've added border:0
to every iframe reference in the fancybox css and even border: 0 none
. In the jquery.fancybox.pack.js file, the only reference to an iframe style (class="fancybox-iframe"
) has frameborder="0"
. Added "seamless" to that.
Results: On a PC, iPad and iPhone, the fancybox iframe has no border. Also on a Samsung Core Prime, there are no borders in the Android browser. It only happens in Chrome on the same Samsung - a thick (maybe 3px) gray border right and bottom, which don't meet in the bottom-right corner.
The Chrome borders are inset slightly from the edge of the iframe, so that content in the iframe sits on top of them. So maybe they're not even borders.
UPDATE @JFK - Found similar issue on github/fancyapps. No solution found. But also this one, which may be relevant - some see borders, others scrollbars. Or could it have something to do with -webkit-overflow-scrolling: touch
?
From the comment by mgarnerventuretech in this GitHub issue:
.fancybox-inner{ overflow: auto !important; }
Got rid of scrollbars in fancybox iframe in Chrome on Samsung Core Prime.