Question

我有一个网站，一切都在谷歌浏览器中运行完美，但在IE和Firefox中，当浏览器调整到800px以下时，我丢失了内容填充。

http://www.readysetpixel.net/about.html是网址。如果您的屏幕高度超过800px，它将在20px的底部显示填充，但是当您调整屏幕大小时IE和FireFox只是忽略填充。

这有什么理由吗？我已经尝试了很多不同的东西。我疯了。

Answer 1

问题是因为您明确将max-height设置为490px。如果您有针对设备的要求，则应使用媒体查询。是否有理由使用

<script type="text/javascript">
$(document).ready(function() {
   $(window).on('resize', function(){
     if ($(this).height() <= 800){
      $('.content').css('max-height', '490px'); //sets max-height
     } else{
      $('.content').css('max-height', ''); //deletes max-height
   }
 }).resize()
})
</script>

位于页面底部。我也看到你没有元端口视图标签所以显然也没有做响应式设计。在底部（上图）摆脱脚本，你应该设置。

Answer 2

您可以在CSS中为min-width或某些父选择器尝试body;

body{
  min-width: 800px;
}

丢了我的垫子

2 个答案: