Home > Article > Web Front-end > DIV with overflow attribute under IE9-is regarded as the parent element of the positioned element to determine positioning_html/css_WEB-ITnose

DIV with overflow attribute under IE9-is regarded as the parent element of the positioned element to determine positioning_html/css_WEB-ITnose

WBOYOriginal: 2016-06-24 12:25:041287browse

例子：

<body style="margin: 0px;">    <table cellpadding="0" cellspacing="0" border="0">		<tr>			<td style="height: 50px;"></td>		</tr>		<tr>			<td>				<table cellpadding="0" cellspacing="0" border="0">					<tr>						<td style="width: 50px;"></td>						<td>							<div id="divA" style="overflow: hidden; height: 100px; width: 100px; background-color: #000000;">								<div id="divB" style="position: absolute; left: 50px; height: 50px; width: 50px; top: 50px; background-color: #e0e0e0;">ABC</div>							</div>						</td>					</tr>				</table>			</td>		</tr>    </table></body>

divA (黑色)设置了style.overflow = "hidden"，在 IE9及以下浏览器中导致了其中的 divB (灰色，style.position = "absolute")按照divA而非body定位。请看截图。

IE9下的截图：

Chrome下的截图：

我想要的结果是Chrome下的，即divB按照body定位。可现在的情况是，实际项目中如果去掉divA的overflow属性，或是将divB拿出到divA外面去，都会导致大量工作量。现在有办法通过css或其他手段解决IE下的问题吗？

回复讨论(解决方案)

b585974ae3b7dba3039af53a9593f9c4
383eb734b02b508089ba2d78eb4c6f68
93f0f5c25f18dab9d176bd4f6de5d30e
ebeda52af7641f7e715679a8472f8c69
b2386ffb911b14667cb8f0f91ea547a7无标题文档6e916e0f7d1e588d4f442bf645aedb2f
9c3bca370b5104690d9ef395f2c5f8d1

0c71f7e80fc34372640ff9b198511203
    13589ffb93d28ab2017eed88bdfa300d
        a34de1251f0d9fe1e645927f19a896e8
            f4aaef5f5db11ee09f45f55db912f8e8b90dd5946f0946207856a8a37f441edf
        fd273fcf5bcad3dfdad3c41bd81ad3e5
        a34de1251f0d9fe1e645927f19a896e8
            b6c5a531a458a2e790c1fd6421739d1c
                13589ffb93d28ab2017eed88bdfa300d
                    a34de1251f0d9fe1e645927f19a896e8
                        8984e90bc74bbc2fe43286b3ab71575fb90dd5946f0946207856a8a37f441edf
                        b6c5a531a458a2e790c1fd6421739d1c
                            705b4b5ef949020c958144dfda6a03f1
                                f1f62f6a6f2222a457340fbc21242bb0ABCff08446555d67280abe25aa6621a3d32
                        b90dd5946f0946207856a8a37f441edf
                    fd273fcf5bcad3dfdad3c41bd81ad3e5
                f16b1740fad44fb09bfe928bcc527e08
            b90dd5946f0946207856a8a37f441edf
        fd273fcf5bcad3dfdad3c41bd81ad3e5
    f16b1740fad44fb09bfe928bcc527e08
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e
没有啊  我在ie9下显示正常啊

我这里没问题啊是不是dtd什么不对啊
或者干脆用那个黑色的div定位吧吧A的position设为relative B的left和top都为0试试

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

你现在的页面在IE开发模式下看浏览器模式中的文档模式肯定是“杂项”quirks模式。

不纠结了。决定换个solution做。感谢两位的回复。

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：The world is entangled. . Brothers and sisters_html/css_WEB-ITnoseNext article：The world is entangled. . Brothers and sisters_html/css_WEB-ITnose

See more

DIV with overflow attribute under IE9-is regarded as the parent element of the positioned element to determine positioning_html/css_WEB-ITnose

回复讨论(解决方案)

Related articles