Question

适用于FF和Chrome，但很难找到IE9解决方案。渐变有效但它只停在页脚的底部。我认为有高度：100％会解决这个问题，但似乎没有效果。任何帮助将非常感激。谢谢。这就是我所拥有的：

HTML CODE

<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="css/style4.css"/>
<link rel="stylesheet" type="text/css" href="css/prfQ.css"/>
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="css/IEstyle.css" />
<![endif]-->
<title></title>
</head>
<body>
<div id="header"></div>

<div id="container">

    <div id="left" class="column"></div>
    <div id="center" class="column"></div>
    <div id="right" class="column"></div>
</div>

<div id="footer"></div>

CSS / IEstyle.css

@CHARSET "ISO-8859-1";

body {

-ms-filter:"progid:DXImageTransform.Microsoft.gradient ( startColorstr = '#424242',     endColorstr = '#e9e9e9' )";
background-image:
    url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9ImczMjIiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNFOUU5RTkiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMSIvPgo8L2xpbmVhckdyYWRpZW50Pgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2czMjIpIiAvPgo8L3N2Zz4=);
}

CSS / style4.css

@CHARSET "ISO-8859-1";

* {
margin: 0;
padding: 0;
}

body {
height: 100%; margin : 0 auto;
padding-left: 352px;
padding-right: 352px;
background: -webkit-linear-gradient(top, #424242, #e9e9e9);
background: -moz-linear-gradient(top, #424242, #e9e9e9);
background-attachment: fixed;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
font-family: arial, helvetica, sans-serif;
margin: 0 auto;
}

#header {
background: red;
height: 50px;
min-width: 1154px;
}

#container {
float: left;
min-width: 1154px;
}

#container .column {
min-height: 800px;
float: left;
}

#footer {
background: blue;
height: 50px;
clear: both;
min-width: 1154px;
}

#center {
background: yellow;
min-width: 714px;
background: yellow;
}

#left {
background: orange;
min-width: 220px;
}

#right {
background: purple;
width: 220px;
}

Answer 1

尝试将IE背景渐变附加到body tag, but to html tag.

tag, but to html



Another solution would be to set:

IE中的背景渐变不会延伸到底部

1 个答案: