site all messed up in IE6

[isntworkdull]

Hi all,

I looked at a site i'm redesigning on a friends laptop today, that has IE6...

and was fairly shocked to see that the main page was very bad, it seemd to completely remove my "right column"...

unfortunetely i didnt have time to have a good look at it, and i have IE7 & firefox myself, is there anyway i can download IE6 and have that and IE7 running on the same pc?

i use the css templates provided by dynamic drive, has anyone else come across these not working well in IE6? or is it more to do with code that i have added to it?

If you want to actually see what i mean, the website can be seen at www.selfcctv.co.uk

Any advice welcome

[isntworkdull]

no advice here? or have i been too vague?

please help

[the penguin]

Unfortunately once you upgrade to Ie7, you can't have Ie6 running on your computer anymore. I just looked at your site in FF and Ie6. The best way to fix your issues would be to build it first while testing in Ie6, but you're obviously way past that stage. So the fastest way for you to fix your issues would be to create Conditional Comments. Some call them CSS hacks.

Place this snippet of code in the head of you document:

<!--[if lte IE 6]>
Special instructions for IE 6 here
<![endif]-->

Then create your referenced style sheet to fix all Ie6 bugs. Of course you'll need a different computer with Ie6 to test.

Hope this helps. :rolleyes:

[TheJoshMan]

not necessarily.

You can download an installer which will install IE 6 as a "standalone".

just google the term "Multiple IEs"

[the penguin]

Ahhhhh, very nice. :)

[isntworkdull]

Hi penguin

so could i create a totally new style sheet for IE6 say, and call it style6.css

then put
<!--[if lte IE 6]>
<link href="style6.css" rel="stylesheet" type="text/css"/>
<![endif]-->

in the head section?

thanks for the advice all

this might be helpful for others, i just downloaded multiple IEs from :

http://tredosoft.com/Multiple_IE

and IE 6 seems to be working a treat there...

[TheJoshMan]

the conditional statement can be used to call an entirely separate stylesheet... however, this is bad practice.

The preferred method is to simply find which elements are causing you greif in IE 6, then write declarations inside the conditional statement to fix them.

There is usually not a real need to use a completely separate stylesheet.

[Medyman]

the conditional statement can be used to call an entirely separate stylesheet... however, this is bad practice.

The preferred method is to simply find which elements are causing you greif in IE 6, then write declarations inside the conditional statement to fix them.

There is usually not a real need to use a completely separate stylesheet.

It's bad practice if you're serving both stylesheets -- the default and an IE6 specific one.

On a recent project, the client wasn't interested in supporting IE6 (i love this client). But, we (my creative team) decided that it was still a good idea to do some minimal styling for IE6. This particular project really requires high level of CSS support, as well as some DOM techniques that aren't feasible in IE6. So, what we do is serve an IE6 specific stylesheet, but only that!

In other words, we're not resetting previously set styles for the benefit of an IE6 audience. Instead, we're serving only an IE6 stylesheet.

Simon Clayson recently blogged about the technique that we use (http://www.simonclayson.co.uk/reportage/ie_6_text_only/).

Of course, if you're only changing some margins and/or padding, it makes little sense to server an entirely different stylesheet.

[isntworkdull]

hi again guys

Can you tell me how i put declarations inside conditional statements?

i put this on my site initially :

<!--[if lte IE 6]>
<link href="style6.css" rel="stylesheet" type="text/css"/>
<![endif]-->

and it fixed my site in IE6, the only changes i made to the style sheet from the normal one, was to float a coloumn to the right instead of left, but after reading Nyne lyvez post about bad practise, i tried simply putting :

<!--[if lte IE 6]>
#rightcolumn {float:right;}
<![endif]-->

but this didnt fix anything... what have i done wrong here?

is it as simple as adding <style type="text/css"> #rightcolumn {float:right;} </style> ?

thanks
James

[Medyman]

hi again guys

Can you tell me how i put declarations inside conditional statements?

i put this on my site initially :

<!--[if lte IE 6]>
<link href="style6.css" rel="stylesheet" type="text/css"/>
<![endif]-->

and it fixed my site in IE6, the only changes i made to the style sheet from the normal one, was to float a coloumn to the right instead of left, but after reading Nyne lyvez post about bad practise, i tried simply putting :

<!--[if lte IE 6]>
#rightcolumn {float:right;}
<![endif]-->

but this didnt fix anything... what have i done wrong here?

is it as simple as adding <style type="text/css"> #rightcolumn {float:right;} </style> ?

thanks
James

What Josh (Nyne Lyvez) was referring to as bad practice was to redeclare ALL of your styles in an IE6 specific stylesheet. What you were doing is completely fine.

As to your question, yes the solution you describe is the way to do it.

[TheJoshMan]

i guess i was a little vague?

[Nilsy]

I my experiance the issues that occur with IE6 are usually to do with margins, for some reason if you put a margin the same side that it is floated;


Div{
Float:left;
Margin-left:20px;
}

Then ie6 doubles the margin therefore pushing out the other divs which is why your right hand column is missing.

Try using padding instead of margins and this is a compromise that will make your site look correct in all browsers.