我尝试过在任何地方寻找解决方案,但找不到它。因此在这里发布请求。
我们有一个基于php代码点火MVC框架的网站,但问题在于HTML渲染各种设备imo。渲染页面底部的某个部分在iphone上消失,它在ipad和普通浏览器上渲染得很好。我已将页面保存为HTML,并且能够通过切换各种设备,通过设备的chrome(来自开发人员工具)成功地重现它。
帮助创建这些模板的设计人员不再可访问,因此我无法获得任何进一步的帮助。我怀疑这是一个CSS问题。该网站使用twitter-bootstrap。
截图:
普通浏览器& Iphone redering比较:
(有问题的div标有箭头)
我查看了视图源,并且HTML源代码中的两个版本都出现了有问题的div:
<div class="button-holders button-overlay" id="button_holder">
<div class="col-sm-3 col-xs-3 noway" id="noway" style="display: block;">
<a id="noway1" style="cursor:pointer;text-decoration: none;"> <img src="./Coupon Crank_files/button.png" width="70" height="70"></a>
<a id="noway1" style="cursor:pointer;text-decoration: none;" onclick="rotate_crank_coupon_load('1', '0')"> NO WAY</a>
</div><!--noway-->
<div class="col-sm-3 col-xs-3 nah" id="nah" style="display: block;">
<a id="nah1" style="cursor:pointer;text-decoration: none;"> <img src="./Coupon Crank_files/nah.png" width="70" height="70"></a>
<a id="nah1" style="cursor:pointer;text-decoration: none;" onclick="rotate_crank_coupon_load('2', '0')"> NAH</a>
</div><!--noway-->
<div class="col-sm-3 col-xs-3 sure" id="sure" style="display: block;">
<a id="sure1" style="cursor:pointer;text-decoration: none;"> <img src="./Coupon Crank_files/sure.png" width="70" height="70"></a>
<a id="sure1" style="cursor:pointer;text-decoration: none;" onclick="rotate_crank_coupon_load('3', '0')"> SURE</a>
</div><!--noway-->
<div class="col-sm-3 col-xs-3 ohyeh" id="ohyeh" style="display: block;">
<a id="ohyeh1" style="cursor:pointer;text-decoration: none;"> <img src="./Coupon Crank_files/heart.png"></a>
<a id="ohyeh1" style="cursor:pointer;text-decoration: none;" onclick="rotate_crank_coupon_load('4', '0')"> OH YES</a>
</div><!--noway-->
<div class="report_abouse_style" id="report_abouse" style="display: block;">
<a class="badge badge_edit" id="report_abouse1" style="cursor:pointer;text-decoration: none;"> Report Abuse</a>
</div>
可以通过修改CSS来解决这个问题吗?
我附加了html文件以在本地重现问题:http://filenurse.com/download/c5d96491585893ee917842a6f11f8166.html
非常感谢任何正确方向的帮助。
提前致谢, AD