[Aryana]

I have a problem with a website I designed.

http://homesecuritydream.ca/

In IE 6.0, the content is pushed down below the sidebar (where it says contact us). Since there is still a few people who use this outdated browser, I need to fix it to make sure it looks good.

Any ideas on how I can do this or what it is that in IE6 makes the flow break? (It doesn't help that I do not have IE6 to check how it looks)

[tomdkat]

In order to get this sorted out, you're going to have to either have a copy of IE6 available you can use for testing or have someone do the testing for you.

You can use conditional comments to include an IE6-specific style sheet OR you can redesign the site from the ground up with IE6 in mind.

I'll see if I can find out what styling is needed for IE6 but you're going need to have access to IE6 to test yourself.

Peace...

[Aryana]

I realized today that the error was happening on ANY IE so I used IE7 to get it working, the display work now on IE 7 but I have yet to test it on IE6.

[Aryana]

Okay yeah, I just used http://ipinfo.info/netrenderer/index.php to check, it looks ok on IE7 but breaks on IE6. I really need to figure out a quick fix for this because we may be loosing clients on older browsers when they see no content.

I tried to fix it with a conditional CSS targetting IE6, but it still seems to be breaking on IE6. I am wondering if the large left-padding of the main text is not going below the floated sidebar like it should, thus causing it to break, while it renders fine on older browsers? I had to use that padding because I didn't want the main text (and the bg of the titles) to wrap around the sidebar.

[Aryana]

Okay I think I solved it... by fiddling with widths of items.

[tomdkat]

Originally Posted by Aryana

Okay yeah, I just used http://ipinfo.info/netrenderer/index.php to check, it looks ok on IE7 but breaks on IE6. I really need to figure out a quick fix for this because we may be loosing clients on older browsers when they see no content.

Cool. I also suggest using Browser Shots since you can try more browsers on more platforms but getting site updates tested can be challenging.

I tried to fix it with a conditional CSS targetting IE6, but it still seems to be breaking on IE6. I am wondering if the large left-padding of the main text is not going below the floated sidebar like it should, thus causing it to break, while it renders fine on older browsers? I had to use that padding because I didn't want the main text (and the bg of the titles) to wrap around the sidebar.

I found some IE6 styling that appears to work. Attached is a screenshot.

Put this CSS style in an IE6 specific stylesheet you conditionally include:

#main {
padding-left: 0px;
margin-left: 245px;
padding-right: 5px;
margin-right: 0px;
}

See what that does. The above rendered as displayed in the attached screenshot. The screenshot is of Maxthon 2.1.1 (w/ IE6 rendering engine).

Peace...

[tomdkat]

So, did the above styling work for you?

Peace...

[Aryana]

I decided to keep the slight change I made, since yours showed squared corners for the contact form. Both are pretty similar though, I just switched borders around in other places.

I have another headache to tackle with the new page but that one will have to be totally different for IE6 I think, because it uses absolute positionings that just... don't work on IE6...

[tomdkat]

Originally Posted by Aryana

I decided to keep the slight change I made, since yours showed squared corners for the contact form. Both are pretty similar though, I just switched borders around in other places.

Ah, that's just because not all the images got downloaded when I saved a copy of your page. My change had nothing to do with the "side2" DIVs at all and focused on the "main" DIV instead.

In any event, glad you got it sorted out.

Peace...

[Aryana]

The interaction of the two are the part that gets complex with different rendering machines. If only people would upgrade to 7.0 completely! But about 16% of users visiting have IE6 so I have to make it presentable, even if I haven't been able to get iepngfix to work.

[tomdkat]

Yep, I know what you mean and I feel your pain.

Peace...