Sun, 2004-03-14 07:33
Hi all,
I have a request to ask for checks on the following site.
http://www.sharperstill.com
One problem that I know about is IE6/Win, which places the grad background-image at the bottom of the main DIV as well as at the bottom of the viewport (where I wanted it)
The css for the background image is:
html, body {
margin: 0;
padding: 0;
background: #ECECE6 url(../graphics/bggrad.jpg) bottom left fixed repeat-x;
color: #333;
}
Hope someone can help as I develop on a mac and it is fine in all gecko browsers, safari etc
Jon
Sun, 2004-03-14 09:05
#1
Need help with IE 6/WIN issue
Jon
1) I would just go for a simpler background. The fact is most clients will use IE, and you want your site to look good for them.
or
Use some hacks to hide the background image from IE and then some more hacks to use an IE's proprietary gradient as per -
Here is my template
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Untitled</title>
<meta name="keywords" content="put keywords here seperated by comma's" />
<meta name="description" content="put a description here" />
<meta name="robots" content="all" />
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link href="put your stylesheet here.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" language="javascript" src="put your javascript here.js"></script>
<style type="text/css">
.test1{
height: 50px;
background-color: blue;
filter: Alpha(opacity=100, finishopacity=0, style=1, startx=0, starty=100, finishx=0, finishy=0);
margin: 10px 0px;
}
.test2{
height: 50px;
background-color: blue;
filter: Alpha(opacity=100, finishopacity=0, style=1, startx=0, starty=0, finishx=0, finishy=100);
margin: 10px 0px;
}
.test3{
height: 50px;
background-color: blue;
filter: Alpha(opacity=100, finishopacity=0, style=1, startx=100, starty=0, finishx=0, finishy=0);
margin: 10px 0px;
}
.test4{
height: 50px;
background-color: blue;
filter: Alpha(opacity=100, finishopacity=0, style=1, startx=0, starty=0, finishx=100, finishy=0);
margin: 10px 0px;
}
.test5{
height: 500px;
background-color: blue;
filter: Alpha(opacity=100, finishopacity=0, style=1, startx=100, starty=100, finishx=0, finishy=0);
margin: 10px 0px;
}
</style>
</head>
<body>
<div class="test1"></div>
<div class="test2"></div>
<div class="test3"></div>
<div class="test4"></div>
<div class="test5"></div>
</body>
</html>
2) Why not centre your box in the viewport - it would look better.
Regards
Day