Html IE7中的等效CSS是什么?
我有一些HTML和CSS,它们都可以在IE8和更高版本中使用。然而,在IE7中,这不起作用。包装器位于左侧,而不是居中。此CSS是问题的最低金额,但我有以下一些要求:Html IE7中的等效CSS是什么?,html,css,internet-explorer,Html,Css,Internet Explorer,我有一些HTML和CSS,它们都可以在IE8和更高版本中使用。然而,在IE7中,这不起作用。包装器位于左侧,而不是居中。此CSS是问题的最低金额,但我有以下一些要求: 绝对定位的包装器 灵活的宽度(此处设置为90%,同时具有最大和最小宽度) 39px的顶部(用于说明横幅) 假设,我可以进行IE7黑客攻击,范围如下: *left: 50%; *margin-left: -45%; 但是,我不想。。。无论如何,以下是标记: <!DOCTYPE html> <html lang
- 绝对定位的包装器
- 灵活的宽度(此处设置为90%,同时具有最大和最小宽度)
- 39px的顶部(用于说明横幅)
*left: 50%;
*margin-left: -45%;
但是,我不想。。。无论如何,以下是标记:
<!DOCTYPE html>
<html lang='en'>
<head>
<style type="text/css">
#banner-wrapper {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 39px;
width: 100%;
min-width: 752px;
background-color: rgb(95,95,95);
z-index: 1;
}
#wrapper-main {
position: absolute;
top: 39px;
left: 0;
right: 0;
bottom: 0;
width: 90%;
max-width: 1200px;
min-width: 750px;
min-height: 620px;
background-color: lightblue;
margin: 0 auto;
overflow: hidden;
z-index: 0;
}
#wrapper-left {
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 180px;
background-color: green;
}
#wrapper-content-container {
position: relative;
padding-left: 181px;
height: 100%;
top: 0;
right: 0;
left: 0;
overflow-y: scroll;
z-index: 0;
}
#wrapper-content {
position: relative;
min-height: 900px;
width: 100%;
z-index: 0;
}
</style>
</head>
<body>
<div id="banner-wrapper"></div>
<div id="wrapper-main">
<div id="wrapper-left">THIS STAYS HERE</div>
<div id="wrapper-content-container">
<div id="wrapper-content">
<!-- Scrollable content goes here -->
THIS SCROLLS
</div>
</div>
</div>
</body>
</html>
#横幅包装{
位置:绝对位置;
排名:0;
左:0;
右:0;
高度:39px;
宽度:100%;
最小宽度:752px;
背景色:rgb(95,95,95);
z指数:1;
}
#包装总管{
位置:绝对位置;
顶部:39px;
左:0;
右:0;
底部:0;
宽度:90%;
最大宽度:1200px;
最小宽度:750px;
最小高度:620px;
背景颜色:浅蓝色;
保证金:0自动;
溢出:隐藏;
z指数:0;
}
#左包装{
位置:绝对位置;
排名:0;
底部:0;
左:0;
宽度:180px;
背景颜色:绿色;
}
#包装内容容器{
位置:相对位置;
左侧填充:181px;
身高:100%;
排名:0;
右:0;
左:0;
溢出y:滚动;
z指数:0;
}
#包装内容{
位置:相对位置;
最小高度:900px;
宽度:100%;
z指数:0;
}
这个留在这里
这个卷轴
有什么办法可以让这一切顺利进行吗?相对定位的包装在完整形式下会严重影响设计,同样,固定宽度也会影响设计。我没有主意了,但也许其他人知道一个可行的解决方案
注意:我添加了更多的HTML/CSS以澄清一些总体设计
感谢您的帮助。尽管您提到不想使用IE7破解,但这里是一种创建仅IE7样式而不添加其他样式表的有效方法,这将解决您的问题,添加以下代码
<!--[if IE 7 ]> <html class="ie7"> <![endif]-->
<!--[if !(IE 7)]><!--> <html> <!--<![endif]-->
只针对ie7中的任何元素
为了充分披露,如果您使用条件注释,如:
<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]-->
只是一个问题,为什么你仍然支持这个糟糕的浏览器?我经常这样问自己。然而,这是因为特定的客户可能会遇到该网站。当通过IE7查看时,我真的更愿意让网站至少有点“连贯”。但是,是的……这是一个糟糕的浏览器。一个绝对定位的包装器?如果上面只有一个横幅的话,这似乎是不必要的。你是对的。那是我把它扔进去的,因为我受够了IE7,我想为什么不。。。它已经被相应地移除了。看起来你可以在没有绝对定位的包装器的情况下实现你想要的任何效果。
<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]-->