HTML和身高不是100％

Question

我有一个jQuery移动页面。 即使我在html和body上设置了100％，html和body的高度仍然与其内容容器（着陆容器）不同。 对于此jsfiddle示例，其主体的高度约为300px，但着陆容器的高度约为1600px。 我正在使用Chrome。 为什么会发生，并且有任何解决方法？

html, body {
    min-height: 100%;
    -webkit-text-size-adjust: 100%;
}

<html>
<body>
<div id="holder" data-role="page" data-theme="none" data-ajax="false">
    <div class="header">
    </div>
    <div class="landing-container">
    </div>
</div>
</body>
</html>

您可以在这里查看。 http://jsfiddle.net/angelohuang/brbqh/4/

Answer 1

可能是因为您有position: absolute在某些东西上？

绝对定位使元素脱离了常规布局流程，因此不会影响其父级的高度。

由于data-role jQuery mobile似乎添加了许多这样的样式。 我个人不熟悉jQuery mobile，但也许您是以非标准方式使用它的？

编辑

哦，哈哈 这也可以做到：

.ui-mobile, .ui-mobile body {
  height: 99.9%;
}

这样，除非我感到困惑，否则它永远不会超过窗口高度。

HTML和身高不是100％

问题描述

1 个解决方案

解决方案1
1 已采纳 2013-04-09 22:51:53

HTML和身高不是100％

问题描述

1 个解决方案

解决方案1 1 已采纳 2013-04-09 22:51:53

解决方案1
1 已采纳 2013-04-09 22:51:53