页面扩展超出HTML标记

时间:2015-03-26 04:24:38

标签: html css overflow

这与人们挣扎的常规溢出问题完全不同。首先,我只能在Chrome(版本41.0.2272.101 64位)中产生此问题。 IE 9+和Firefox似乎表现得像预期的那样。

身体元素随着内容而增长。此处未使用height: 100%position: absolute样式。 问题是,似乎有一些未知的东西迫使浏览器在x轴和y轴上进一步滚动大约400px或更多。检查员无法在此空白区域中选择任何内容,最终选择html标记。 我已浏览过页面上的每个元素,似乎没有任何内容超出html标记!

不幸的是,我无法链接任何内容,因为该网站位于工作服务器上,并且需要身份验证才能访问该页面:(
我很难过,所以任何建议都会非常感激!

1 个答案:

答案 0 :(得分:1)

我发现问题涉及jQuery UI,css随插件和我公司的css提供。我们在应用程序中使用jQuery UI作为输入建议。

似乎正在发生的事情是,我们的html结构最近的变化将特定元素的高度和宽度设置为100%。这个css恰好包含了jQuery UI的ui-helper-hidden-accessible类。随插件提供的css设置了ui-helper-hidden-accessible,其中包括position: absolute;clip:rect(1px,1px,1px,1px);。由于父元素未显式设置为position: relative;,因此ui-helper-hidden-accessible元素溢出,但由于clip属性,它在开发人员工具中不可见!选择隐藏元素或在开发工具元素选项卡中单击它都不会显示它有多大。

这个问题有两种解决方案:

  1. 更改将宽度和高度设置为100%的css选择器
  2. 将父元素设置为position: relative;