IE Backwards Compatibility

All the way to IE 5.5

Page 1 of 1

3 Replies - 2098 Views - Last Post: 30 January 2010 - 09:48 PM

#1 MrWobbles  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 31
  • View blog
  • Posts: 328
  • Joined: 11-April 08

IE Backwards Compatibility

Posted 25 January 2010 - 10:49 AM

So I am trying to get a couple websites backwards compatible to IE 5.5. My only problem is in the CSS department.

In IE 5.5 & 6 the navigation pushes the content down below it. I have made a few changes but the content won't go up where I want it.

For testing I am using IETester and the actual web page I am having problems with is www.lions26m4.org.

My CSS file looks like this:

/* CSS Document */

img{
	padding-bottom: 10px;
}

body{
	background-image: url(img/bodyBG.gif);
	background-repeat:repeat;
	font-family: Calibri, Cambria, Tahoma;
	font-size: 14px;
}

.header{
	margin-left: -15px;
}

.subHead {
	font-size: 16pt;
	font: Calibri, Cambria, Tahoma;
	color: #660066;
	background-color: #ffcf06;
	
	text-indent: 10px;
}

.text {
	padding-right: 10px;
}

.footer {
	background-color: #ffcf06;
	width: 640px;
	height: 50px;
	padding-left: 200px;
	text-align:center;
	text-indent: 10px;
}

#content{
	width: 625px;
	min-height: 600px;
	margin: 0;
	padding-left: 215px;
	margin-top: -15px;
	background-color: #F5F5F5;
}

#nav{
	margin: 0;
	margin-left: -60x;
	margin-top: 0px;
	width: 200px;
	float: left;
	background:  #ffcf06;
	position:  fixed;
	clear: left;
}

#nav ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

#navbotIMG{
	background-image:url(img/bottomNav.gif);
	background-color: #004f9b;
	background-repeat:no-repeat;
	width/**/: 200px/**/;
	height: 100px;
	min-height/**/: 60000px/**/;
}

#navtopIMG{
	background-image:url(img/topNav.gif);
	width: 200px;
	height: 135px;
}

#nav li a:link, #nav li a:visited {
	color: #660066;
	display: block;
	padding: 4px 0 4px 5px;
	text-decoration: none;
}

#nav li a:hover{
	text-decoration: underline;
}



Thanks in advance for any help you provide!

Also I have uploaded the CSS document for download if you prefer it that way.[attachment=16114:attachment]

Is This A Good Question/Topic? 0
  • +

Replies To: IE Backwards Compatibility

#2 arthurakay  Icon User is offline

  • D.I.C Head

Reputation: 22
  • View blog
  • Posts: 226
  • Joined: 17-February 09

Re: IE Backwards Compatibility

Posted 27 January 2010 - 08:27 AM

First of all... why in god's holy name do you want to test in IE 5.5? I looked through my site's analytic data, and over the past two years only 1 person has looked at the site in IE5.5. That person was me. If I'm being honest, IE5.5 is a waste of your time, and EVEN IF you have users browsing in it you're better off creating a popup telling them to download a more recent version. IE5.5 is completely insecure and doesn't support most of the CSS/JS improvements over the past 5 years.

On to your question...

My advice would be to do two things:
(1) Create a wrapper DIV to surround both your #nav and #content containers. Set the width of this wrapper using CSS.
(2) Remove the left-padding on your #content container and simply use "float: right"

Give that a shot and let me know how it turns out.
Was This Post Helpful? 1
  • +
  • -

#3 MrWobbles  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 31
  • View blog
  • Posts: 328
  • Joined: 11-April 08

Re: IE Backwards Compatibility

Posted 30 January 2010 - 03:00 PM

that works great, but now when I test it in IE 7 the navigation only sometimes shows up....

I have to refresh it a few times to get the navigation to show up (weird that it shows up after a couple of refreshes).

Any thoughts on this?

This post has been edited by MrWobbles: 30 January 2010 - 03:00 PM

Was This Post Helpful? 0
  • +
  • -

#4 nightscream  Icon User is offline

  • D.I.C Head

Reputation: 19
  • View blog
  • Posts: 237
  • Joined: 04-December 08

Re: IE Backwards Compatibility

Posted 30 January 2010 - 09:48 PM

do the following
create a css file that supports all browsers(latest ones)
than use the conditional statements(if, else) that ie supports to add a special css file for ie6 and below.

search google for it, if you need information about it.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1