E6/IE8/FF对div+css的不同,在IE8中好好的,在IE6中就不行了。

代码如下,大侠救我。
#banner1 {
float: left;
height: auto;
width: 355px;
margin-left: 20px;
display:inline
}
#box {
background-color: #F9E7B9;
height: auto;
width: 885px;
margin-right: 260px;
margin-left: 60px;

}

#banner2 {
float: right;
height: auto;
width: 350px;
margin-right: 20px;
margin-left: 50px;
display:inline
}
#main {
background-color: #FDFCFA;
width: 580px;
margin-right: 100px;
margin-left: 130px;

height: auto;
border-top-width: 10px;
border-right-width: 10px;
border-left-width: 10px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #B3C255;
border-right-color: #B3C255;
border-bottom-color: #B3C255;
border-left-color: #B3C255;
margin-top: -80px;

}

#text3 {
height: auto;
width: auto;
margin-right: 20px;
margin-left: 20px;
}
#connect {
height: auto;
width: 1000px;
margin-left: 2px;
}

#banner {
height: 80px;
width: 800px;
margin-top: 10px;
}

#top {
height: 40px;
width: 700px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
margin-top: 50px;
background-color: #B3C255;
margin-right: 50px;
margin-left: 54px;
}
#picture {
height: 200px;
width: 540px;
background-image: url(picture/picture.jpg);
background-repeat: no-repeat;
margin-top: 10px;
margin-right: 20px;
margin-left: 20px;
}
#one {
height: auto;
width: 70px;
margin-left: 5px;
margin-top: 25px;
float: left;
}
#four {
height: auto;
width: auto;
float: left;
margin-left: 25px;
margin-top: 20px;
}
#five {
height: auto;
width: auto;
margin-top: 15px;
margin-left: 23px;
float: left;
}
#two {
height: auto;
width: auto;
margin-left: 25px;
float: left;
margin-top: 25px;
}
#three {
height: auto;
width: auto;
margin-top: 15px;
margin-left: 21px;
float: left;
}
#left {
height: 67px;
width: 86px;
margin-top: 50px;
margin-bottom: -118px;
margin-left: -650px;
}

#text2 {
height: auto;
width: 540px;
margin-right: 20px;
margin-left: 20px;
margin-top: 5px;
}
#date {
height: 35px;
width: 95px;
float: left;
margin-left: 20px;
background-image: url(picture/date.png);
}
#excel {
height: auto;
width: 480px;
}

#text {
height: auto;
width: 540px;
margin-top: 130px;
margin-right: 20px;
margin-left: 20px;
}
不好意思,各位。具体有两个方面。
#main {
background-color: #FDFCFA;
width: 580px;
margin-right: 100px;
margin-left: 130px;

height: auto;
border-top-width: 10px;
border-right-width: 10px;
border-left-width: 10px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #B3C255;
border-right-color: #B3C255;
border-bottom-color: #B3C255;
border-left-color: #B3C255;
margin-top: -80px;

}
和#top {
height: 40px;
width: 700px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
margin-top: 50px;
background-color: #B3C255;
margin-right: 50px;
margin-left: 54px;
}
在IE8中top应在贴在main上,但是在IE6中top被main压在下面。

另外
#connect {
height: auto;
width: 1000px;
margin-left: 2px;
}
在IE8中位置很好,但在IE6中位置偏左。

谢谢大家了。
最新回答
害羞的初恋

2024-09-30 09:59:05

不知道你贴出来这么长的css样式是干什么呢 不过给你看看一下他们几个的区别在css样式中

"\9" {background-color:red\9;} 这里的\9可以区别所有的IE和FF

"*" IE6、IE7可以识别,IE8、FF不能

"_" IE6可以识别,IE7、IE8、FF不能
希望对你有帮助
奥妙权志龙洗衣机

2024-09-30 14:30:35

LZ啊,具体是哪里出了问题,或者说是哪一小范围出了问题你不清楚吗,不要粘这么多代码,代码是你写的,又没有注释,别人很难有精力这么给你费力的看,希望精简。
另外一楼的问题是用来解决兼容性的,是一种比较宽泛的方法,你看看能不能解决你的问题,如果不能,还请精简问题。
心有〃余悸

2024-09-30 13:25:59

你写的代码实在有点冗余了,我真的没耐心看但我想有个针对IE6的margin 和 padding,举个例子就是说不管你在其它下是怎么写的在旁边也要加上一句“_margin:10px 20px 0 20px”这样子的是特为IE6量身打造的,希望能帮到你啦,还有就是代码的精简希望以后多多注意。。。
奶气缠身

2024-09-30 02:12:43

在banner1,banner2这两个层下面加一个层,样式为{ clear:both; line-height:0; font-size:0;}
其作用是清除浮动,IE6中有这个bug,有float的时候清除浮动就好了
悲伤∩侵蚀的笑

2024-09-30 18:13:21

这是浏览器兼容性问题,找一找兼容方面的只是看一下