Click to See Complete Forum and Search --> : IE Problem


ninjaturtles
12-19-2005, 09:41 AM
Hi,

This page (http://azer.wordexplorer.us/Untitled-1.htm) works on Firefox, Mozilla but doesn't work on IE..

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
<!--
@media screen{
body>div#red2{
position:fixed;
}
}

#red2 {
z-index: 999999;
position: absolute;
left: 775px;
top: 200px;
}
-->
</style>
</head>

<body>
<div id="red2">always on top</div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</body>
</html>

ShrineDesigns
12-19-2005, 09:50 AM
IE does not support the position: fixed;
nor does it support decendant selectors (ex. E > F)
you can shorten it up like this#red2 {
position: absolute;
position: fixed;
top: 200px;
left: 775px;
z-index: 99; /* 1-99 */
}

thewebman
12-19-2005, 09:59 AM
try this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
<!--
/* added this */
body {
margin: 0px;
}

@media screen
{
div#red2
{
position: fixed;
}
/* ie fix */
* html
{
overflow-y: hidden;
}
* html body
{
overflow-y: auto;
height: 100%;
}
* html div#red2
{
position: absolute;
}
/* All done. */
}

#red2 {
z-index: 999999;
position: absolute;
left: 775px;
top: 200px;
border:1PX SOLID BLACK;
}
-->
</style>
</head>

<body>
<div id="red2">ALWAYS ON TOP</div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</body>
</html>

ninjaturtles
12-19-2005, 10:18 AM
@thewebman, this doesn't work..

thewebman
12-19-2005, 10:58 AM
really? it works on my computer on both firefox and ie.

ninjaturtles
12-19-2005, 11:48 AM
okey, I completed, thanks a lot..