Ios 在fancybox窗口中引导列不适应小屏幕

我有一个在fancybox中打开html文档的站点。html有两个相等的列-因此我有两个

div。这两个栏在桌面、iPad纵向和横向上显示得非常好，但由于某些原因，它在iphone上没有切换到一个栏。它仍然在iphone上显示两列，分别是横向和portait

引导列在我的主html上正常工作，但在fancybox中打开的html上不能正常工作。你知道为什么html不会在更小的屏幕上切换到单列吗

Fancybox脚本

<script type = "text/javascript">
  $(function() {
    //    fancybox
    jQuery(".fancybox").fancybox({
      'type': 'iframe', // tell the script to create an iframe
    });
  });
</script>

$（函数（）{
//幻想箱
jQuery（“.fancybox”）.fancybox({
'type'：'iframe'，//告诉脚本创建iframe
});
});

HTML

歌曲列表
查看Paul当前曲目中歌曲的综合列表

谢谢#谢哈里。问题确实出在iframe上。我的主html文档中的新代码：

歌曲列表
查看Paul当前曲目中歌曲的综合列表

您能发布fancybox脚本吗？为什么要创建iframe，为什么不创建内联内容？有什么区别？songlist.html会在my index.html上弹出。这可以按预期工作，但对于较小的屏幕，它不会将大小调整为1列，因为引导样式应该考虑到这一点。相反，songlist.html尝试在iphone上显示两列。我在页面上有一些链接，使用fancybox弹出。。。一些包含youtube视频、一些soundcloud播放列表和一些html文件。

<figure class="effect-jazz">
    <img src="hover/img/6.jpg" alt="img06"/>
        <figcaption>
            <h2>Song <span>List</span></h2>
            <p>View a comprehensive list of songs in Pauls current repertoire.</p>
            <a  class="fancybox fancybox.iframe" href="songlist.html"></a>
        </figcaption>           
</figure>