遇到一个div设置了overflow:hidden后超出屏幕部分无法显示的问题_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-21 09:33:17
Original
1918 Leute haben es durchsucht

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style type="text/css">	.out {		overflow:hidden;	}	.inner {		width:100%;	}</style></head><body><div class="out">	<table class="inner">    	<tr>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        	<td>sadfsadfsadfsassssssssssssssssssssssssssssssssssssssssssssssssssssd</td>        </tr>    </table></div></body></html>
Nach dem Login kopieren


这是一个简单的demo
请问。为什么给div设置了 overflow:hidden之后,超出屏幕的部分就无法显示。
此问题出现于除ie6外的浏览器中。

我的overflow:hidden是必须要的,求解。


回复讨论(解决方案)

    .out {
width:100%;
        overflow:hidden;
    }

    .out {
width:100%;
        overflow:hidden;
    }
不好意思啊,你加了个width:100%,还是没有效果。如果给.out加上固定宽度,让宽度等于inner就可以解决,但是我不希望这样,因为会有很多的页面用到.out

本来就是这样的啊
你把div设置成overflow:hidden。内层的溢出元素,肯定不会显示了

加上这个试试 .inner td{float:left;}

昏,理解错了。

试试3楼的。

本来就是这样的啊
你把div设置成overflow:hidden。内层的溢出元素,肯定不会显示了

加上这个试试 .inner td{float:left;}
对此我表示不行啊。td貌似没法做浮动吧?

td是可以浮动的,但是它的浮动并不是每个浏览器都支持的。

ie6、7是不支持td的浮动的。

按你的要求:
一个方法是删除overflow:hidden;
一个方法是设置.out固定宽度,但设置能全显示的宽度overflow:hidden;也就没有多大意义了吧。
你的需求就不是合理的需求。

overflow:hidden;先理解下它

按你的要求:
一个方法是删除overflow:hidden;
一个方法是设置.out固定宽度,但设置能全显示的宽度overflow:hidden;也就没有多大意义了吧。
你的需求就不是合理的需求。
呵呵,这倒是。

overflow:hidden;先理解下它
恩。理解的,只是没想到div的默认宽度最大只有一个屏幕,超出了就必须设置宽度了。

LZ在做文字滚动效果吗?

LZ在做文字滚动效果吗?
不是啊。仅仅是一个表格撑开div的问题。

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage