Tue, 2004-08-03 16:50
I'm working on a new site and I'm a noob to CSS.
This code works flawlessly under Firefox (thats all I've got available for alternative downloads as our sys admin is quite strict) but under IE6 it wont display properly. Perhaps one of you could help me?
Here is the relevent code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<HEAD>
<TITLE>XXX Company</TITLE>
<STYLE type="text/css">
<!--
BODY { background:#FFFFFF }
BODY { color :#FFFFFF;
font-size : 16pt;
font-family : Arial}
H1 { background:#003366;
top:0px;
}
H2 { background:#003366;
color : beige;
font-weight: bold;
font-size : 8pt;
font-family : Arial}
CONTENT {
margin:0px 210px 50px 10px;
padding:10px;
color : black;
}
FEATURE {
position:fixed;
top:100px;
right:20px;
width:160px;
padding:10px;
background-color:#eeeeee;
border:1px solid #003366;
line-height:15px;
-->
</STYLE>
</HEAD>
<body bgcolor="#FFFFFF" text="#003366" link="#003366" vlink="#003366" alink="#003366">
<CENTER>
<!-- <H1>TEST</H1>
--><script type='text/javascript'>
function Go(){return}</script>
<script type='text/javascript' src='exmplmenu_var.js'></script>
<script type='text/javascript' src='menu_com.js'></script><br>
<div>
<FEATURE>
<font face="Arial" size=2>
<a href="https://www.securelink.com "><img src="some.gif" width="110" height="47" alt="" border="0"><br>
<a href="https://www.securelink.com "><img src="some.gif" width="110" height="47" alt="" border="0"><br>
<a href="https://www.securelink.com "><img src="some.gif" width="110" height="47" alt="" border="0"><br>
<a href="/news.html">June 2004 News Letter</a><br>
<a href="">NISA and CAIS</a>
</div></font>
</FEATURE>
<CONTENT>
<font face="Arial" color="003366"><br><br>TEXT<br><br><br><br><br><br><br><br><br><br></font>
</CONTENT>
<H2><font color="beige" size="1"> <b>All trademarks are owned by Company XXXX and used under license.<br>
XXXX design is a registered certification mark owned by the World Council
of XXXXXand used under license.</b></font></H2>
</CENTER>
</BODY>
</html>
If you notice the calls for javascript pages they are just for a DHTML based menu system.
Thanks in advance for all your help.
Tue, 2004-08-03 23:37
#1
IE6 position problems
Hi AbsoluteStatic,
The doctype you use would put IE into Quirks mode.
In Useful CSS Links there are articles about doctypes and the difference they make.
Here's one you could throw straight in to see if it makes any change.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Hope that helps
Wed, 2004-08-04 12:24
#2
IE6 position problems
You have a couple of 'incorrect' styles both in your CSS and HTML
In your style sheet, CONTENT and FEATURE should be
#content {..... }
#feature {..... }
and in your html you should have
<div id="content">......</div>
<div id="feature">......</div>
Also position:fixed is not supported by IE.
Wed, 2004-08-04 16:20
#3
Okay
I tried your suggestions, and now it messes up my javascript menu in Mozilla, and IE 6 has no change...