我正在使用Foundation布局一个简单的网页,但我遇到了主体尺寸的问题。
无论我做什么,正文的高度都不会达到页面的100%。高度根据浏览器的不同而有所不同,但它总是停留在400px左右。页面上的元素布局都是正确的,尽管正文实际上在页面的一半处被截断,元素溢出,就好像正文根本不在那里一样。查看Chrome上的控制台,我注意到clientHeight属性是400——在我看来,当页面加载时,页面的实际高度会以某种方式被覆盖并强制为400px,但我不知道这是如何发生的,也不知道为什么会发生。以前有人见过这种情况吗?
我使用的是Foundation5.5.2,我的页面标题看起来是这样的:
<meta name='viewport' content='width=device-width, initial-scale=1.0, user-scalable=0'>
<link rel="stylesheet" type="text/css" href="foundation.css">
<link rel="stylesheet" type="text/css" href="normalize.css">
<script src="scripts/modernizr.js"></script>
<script src="scripts/jquery.js"></script>
<script src="scripts/fastclick.js"></script>
<script src="scripts/foundation.min.js"></script>
EDIT-我已经意识到,当页面加载时,clientHeight属性被设置为可见窗口的高度-400px是控制台打开时我的窗口的大小。无所谓-为什么身体大小不根据它所包含的元素?
我修复了它。
解决方案是为主体设置height: auto;
。
当我意识到车身高度被设置为加载窗口大小时,我发现其他人也遇到过这种情况。
https://github.com/zurb/foundation-sites/issues/4732