簡體   English   中英

IE7中的浮動div問題

[英]floating div problem in IE7

我正在嘗試使用帶有浮動div的第二個背景圖像,但在IE6和7中不起作用

我知道浮動div在IE7和更低版本的*中很痛苦,但我確實需要使其起作用。

這是我正在使用的代碼

<body style="background-color:#FFFFFF; margin-top:0px; margin-right:0px;" topmargin="0"       rightmargin="0" leftmargin="0">
<div id="bg2" style="float:right; top:0px; width:450px; height:151px; margin-right:0px; padding-right:0px; font-size:1px; overflow:visible; background-image:url(images/back2.jpg);"></div>

<center>

<div style="position:relative; top:0px; width:1050px; margin:0px; padding:0px; vertical-align:top; text-align:left;">
....(huge div container)...

我還嘗試從包含第二個背景圖像的div中刪除width屬性,然后獲取窗口大小並將差異添加到容器div中,作為帶有Jquery的left屬性。 在所有IE版本中都可以正常運行,但是這次在Chrome上無法運行

這是打印屏幕

有什么想法嗎?

..好吧,實際上我想我找到了解決方案。

我試圖將容器對准中心

我知道div是否沒有足夠的空間容納在窗口中,從而導致IE6和7中的問題,所以我使用了Jquery css屬性來確定浮動背景圖片div的寬度。

<script type="text/javascript">
$(document).ready(function() {
    if($(document).width() > 1050){          //Container's width:1050px
        var wd = document.body.clientWidth;
        wd = Math.round((wd-1050)/2); 
        $("#bg2").css("width" , wd);
        $("#container").css("left" , wd);
    }
});
</script>

和html ...

<body style="background-color:#FFFFFF; margin: 0px; padding: 0px;">
<p align="right">
<div id="bg2" style="position:absolute; float:right; top:0px; right:0px; height:151px; margin:0px; padding:0px; font-size:1px; overflow:visible; background-image:url(images/back2.jpg);"></div>
<div id="container" style="position:absolute; top:0px; width:1050px; margin:0px; padding:0px; vertical-align:top; text-align:left;">
....(huge div container container)....

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM