IE顯示兩個div之間的差距，但不是鉻
[英]IE showing gap between two div but not in chrome
問題描述
我們有簡單的div如下。 這里的問題是div gpsDataDiv和map div inIE之間存在差距。 其次gpsDataDiv是一個帶有動態表的字段，使用這個方法document.getElementById（“gpsDataDiv”）。innerHTML = htmlString; 再次在IE中，表格就在下面，並且不會停留在說400px，因此沒有像chrome或firefox那樣生成滾動條。
<body>
<div id="left" style="width:220px;height:350px;float:left;background:white;">
<div id="gpsDataDiv" style="overflow: auto; max-height: 400px;background:white;"></div>
</div>
<div id="map" style="top:0px;left:220px;height:100%">Map goes here.
</div>
</body>
2 個解決方案
解決方案1
3 已采納 2012-07-12 09:16:35
你的div與id map沒有position:absolute在樣式中是position:absolute的，這是你在單獨的樣式表中有的東西嗎？
一些建議：
1。
你的混合float:left; 具有絕對定位的元素（？）。 您需要確保容器，在這種情況下，正文具有overflow:hidden應用於它，或者使用clearfix 。 這將阻止容器折疊，並可能導致頁面進一步出現問題。
2。
其次，您應該能夠通過使用針對每個瀏覽器的單獨樣式表（ 嘗試搜索特定樣式表 ）或嘗試在html元素上使用類的方法來更改不同瀏覽器中的樣式
<!--[if lt IE 7 ]> <html class="ie6" lang="en" xml:lang="en"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7" lang="en" xml:lang="en"> <![endif]-->
<!--[if IE 8 ]> <html class="ie8" lang="en" xml:lang="en"> <![endif]-->
<!--[if IE 9 ]> <html class="ie9" lang="en" xml:lang="en"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html class="" lang="en"> <!--<![endif]-->
3。
確保您的網頁上有doctype，請嘗試使用下面的html 5 doctype。 如果您未指定doctype，則頁面可以進入怪異模式。 這絕對是你不想要的！
<!DOCTYPE html>
4。
嘗試更改max-height: 400px; height: 400px on id="gpsDataDiv"
如果這些中的任何一個對你沒有幫助，你能把你的問題放在一起嗎？ 它會幫我調試它:)
解決方案2
1 2012-07-12 09:19:55
我試圖重現你的問題。 如果我添加高度：400px到gpsDataDiv，它似乎在IE中正確顯示。
CSS-div未在Chrome或IE中填充其他兩個div之間的空間
[英]CSS - div not filling space between other two divs in chrome or ie
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.