html页面内容超出后显示水平滚动条的问题_html/css_WEB-ITnose
程序员文章站
2022-04-05 23:53:35
...
这个问题已经遇到好几次,解决起来也熟练了很多。
出现这种问题一般都是html或页面中的某一内部元素宽度超了。
下面总结我遇到的几种情况:
1、某一内部元素width设为100%,然而它还有border的宽度,border的宽度不包含在width中,所以结果超了。
2、span行内元素,由于它是行内元素,不设display:block之类,宽度设定对它没用,当初弄的时候没有意识到这个问题,结果在谷歌浏览器没出现问题,在IE中这个就暴露出来了,严重超出屏幕宽度,后来把span设为display:block;再设下它的宽度,问题就解决了。
PS:对设置width:100%的元素要注意它的border、margin、padding,小心超出屏幕范围。
对于寻找超出屏幕范围的内部元素,我一般先把页面分为几大板块来排除目标(即删掉某板块,看剩余版块是否导致出现水平滚动条,若还是出现,则证明该板块正常,否则该板块为我们寻找的目标板块——“罪魁祸首”),再继续在导致超出的版块中继续询查,直到找到该内部元素为止。
这样的方法挺笨的,希望大家分享自己的经验,交流下怎样能快速找到导致页面内容超出的内部元素,O(∩_∩)O谢谢。
上一篇: 全文搜索和替换
推荐阅读
-
TextView采用setText赋值之后不能立即显示在页面上的问题解决_html/css_WEB-ITnose
-
当页面内容溢出或超出边界时显示省略号_html/css_WEB-ITnose
-
报告一个IE很奇葩的滚动条问题--百分比计算宽度为浮点数时的滚动条显示异常_html/css_WEB-ITnose
-
解决带fusionCharts的页面多次点击后不显示的问题_html/css_WEB-ITnose
-
ie8 overflow auto 动态更改内容后不立即显示滚动条的问题_html/css_WEB-ITnose
-
自行解决12306页面显示异常的问题_html/css_WEB-ITnose
-
解决带fusionCharts的页面多次点击后不显示的问题_html/css_WEB-ITnose
-
HTML设计的页面飘动图片浏览器显示问题_html/css_WEB-ITnose
-
我遇到一个问题,这个页面在ie7,ie8下显示正常,但在IE6下显示就是页面左边的显示正常,右边的整个被挤到下边去了,而且是右下边,各位帮忙看一下?_html/css_WEB-ITnose
-
在ie 7或ie 6里如何让超出td宽度的内容浮动显示在后面的td里_html/css_WEB-ITnose