IE9中css的优化问题
IE9中css的优化问题
提问于 2014-09-07 19:59:00
当我的客户使用IE9时，我似乎无法使我的站点css优化以应对IE9的困扰。
网站在这里
看来浮子有问题了。
我试过把所有的最小高度100%提高到100%，但是只有修正了一些问题，透明度和整个div都没有显示出来。
有什么建议吗？)
在IE9中它看起来多么可悲
body {
background-color: lightgray;
background-image: url('img/wall.jpg');
background-size: 100%;
margin: 0;
font-family: "Courier New";
}
#footer a {
color: black;
}
a {
color: white;
}
h1 {
}
p {
margin-top: 64px;
margin-left: 30px;
margin-right: 30px;
color: white;
font-size: 10pt;
font-family: "Courier New";
}
ol {
margin-left: 30px;
margin-right: 30px;
color: white;
font-size: 10pt;
font-family: "Courier New";
}
#navbarWrapper a {
text-decoration: none;
}
#wrapper {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
#logo {
background-image: url('img/saefelogo2.png');
height: 40px;
width: 228px;
margin-left: 40px;
margin-top: 30px;
margin-bottom: 30px;
cursor: pointer;
background-size: auto 100%;
background-repeat: no-repeat;
}
#navbarWrapper {
position: absolute;
top: 130px;
left: 0px;
width: 500;
}
.nav {
color: white;
background-color: black;
margin-top: 2px;
margin-bottom: 2px;
padding-top: 6px;
padding-bottom: 6px;
padding-left: 40px;
text-shadow: 0px 0px 2px #000000;
width: 400px;
background-color: rgba(0,0,0,0.4);
font-size: 10pt;
}
.nav:hover {
background-color: rgba(0,0,0,0.6);
font-weight: bold;
cursor: pointer;
}
#firma #nav1 {
background-color: rgba(0,0,0,0.6);
font-weight: bold;
}
#natklub #nav2 {
background-color: rgba(0,0,0,0.6);
font-weight: bold;
}
#event #nav3 {
background-color: rgba(0,0,0,0.6);
font-weight: bold;
}
#uniform #nav4 {
background-color: rgba(0,0,0,0.6);
font-weight: bold;
}
#speciel #nav5 {
background-color: rgba(0,0,0,0.6);
font-weight: bold;
}
#overv #nav6 {
background-color: rgba(0,0,0,0.6);
font-weight: bold;
}
#job #nav7 {
background-color: rgba(0,0,0,0.6);
font-weight: bold;
}
#ref #nav8 {
background-color: rgba(0,0,0,0.6);
font-weight: bold;
}
#socialWrapper {
position: absolute;
top: 420px;
left: 35px;
}
#facebook {
height: 30px;
width: 30px;
display: inline-block;
background-image: url('img/facebook.png');
margin: 2px;
background-size: 100%;
opacity: 0.6;
}
#linkdin {
height: 30px;
width: 30px;
display: inline-block;
margin: 2px;
background-image: url('img/linkdin.png');
background-size: 100%;
opacity: 0.6;
}
#linkdin:hover, #facebook:hover {
opacity: 0.9;
cursor: pointer;
}
#footer {
width: 400px;
position: absolute;
bottom: 20px;
left: 40px;
font-size: 13px;
}
#contentWrapper {
position: absolute;
width: 600px;
top: 0px;
left: 500px;
/*height: 100%;*/
background-color: rgba(0,0,0,0.9);
min-height: 100%;
height: 100%;
}
#contentHeader {
padding-bottom: 35px;
height: 45px;
vertical-align: bottom;
color: white;
font-size: 17px;
font-weight: bold;
padding-top: 55px;
padding-left: 30px;
}
#contentHeader2 {
padding-bottom: 35px;
height: 60px;
vertical-align: bottom;
color: white;
font-size: 17px;
font-weight: bold;
padding-top: 40px;
padding-left: 30px;
}
#uoverskrift {
font-size: 15px;
font-weight: normal;
}
#pictureWrapper {
height: 225px;
width: 600px;
}
#index #picture {
background-image: url('img/index.png');
background-size: auto 100%;
height: 225px;
}
#event #picture {
background-image: url('img/event.png');
background-size: auto 100%;
height: 225px;
}
#natklub #picture {
background-image: url('img/natclub.png');
background-size: auto 100%;
height: 225px;
}
#firma #picture {
background-image: url('img/firma.png');
background-size: auto 100%;
height: 225px;
}
#uniform #picture {
background-image: url('img/uniform2.png');
background-size: auto 100%;
height: 225px;
}
#speciel #picture {
background-image: url('img/special.png');
background-size: auto 100%;
height: 225px;
}
#overv #picture {
background-image: url('img/materiel.png');
background-size: auto 100%;
height: 225px;
}
#job #picture {
background-image: url('img/job.png');
background-size: auto 100%;
height: 225px;
}
#ref #picture {
background-image: url('img/ref.png');
background-size: auto 100%;
height: 225px;
}
#textWrapper {
width: 600px;
}
#hstreg1 {
height: 1px;
min-width: 100%;
width: 100%;
background-color: black;
position: absolute;
top: 100px;
left: 0px;
}
#hstreg2 {
top: 393px;
height: 1px;
min-width: 100%;
width: 100%;
background-color: black;
position: absolute;
}
#vstreg1 {
top: 0px;
left: 470px;
min-height: 100%;
height: 100%;
width: 1px;
background-color: black;
position: absolute;
}
#vstreg2 {
top: 0px;
left: 1128px;
min-height: 100%;
height: 100%;
width: 1px;
background-color: black;
position: absolute;
}
@media screen and (max-device-width: 480px){
body{
-webkit-text-size-adjust: none;
}
}回答 1
Stack Overflow用户
回答已采纳
发布于 2014-09-09 23:14:57
找到了解决办法
显然，对于IE来说，正确拼写doctype是很重要的！
<!DOCTYPE html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/25714237
复制相关文章
相似问题
腾讯云开发者
