Layout issues is IE 6 & 7

[tianaPalmer]

i recently found out that IE 6 & 7 make this site:

http://www.freedomroc.com

look really crazy. I have the updated versions of Safari, IE and Firefox and so I tested only with these browsers. I'm not sure what I need to do to make this work right - any suggestions?

Thanks!

 

[BillyRayPreachersSon]

Well.. apart from the 'go daddy' ad that appears in IE6 but not in Fx 3... The following should fix the IE6 issues:

The slider can be fixed by giving #slider a position of relative, and then the already-positioned #homeSlider a top and left of 0px (currently it has no top or left).

The blue background around the edges you can fix by either using the AlphaImageLoader filter for your transparent PNGs, or use Fireworks to export an 8-bit PNG with alpha transparency (which degrades in IE6 to full transparency with no filters needed).

Your footer elements can be fixed by giving them all a display of inline for IE6 (either use the _ hack or conditional comments). This will fix the well-documented 'double margin on floated elements' bug.

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[BillyRayPreachersSon]

P.S. Not testing cross-browser is a poor excuse for anyone doing web development. I suggest either:

- Getting IE Tester (lets you test IE5.5, 6, 7) in one program

- Getting Virtual PC 2007 SP1 installed and load up a few XP VMs (TinyXP works for me) with the real browsers installed.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[johnwm]

I have found that many cross-browser layout issues will be fixed if your page validates. See

http://validator.w3.org/check?verbose=1&uri=http://www.freedomroc.com/

I assume that this is only a test page - no commercial operation is likely to buy from a website hosted on a free host with 'This page is hosted free, courtesy of GoDaddy' plastered across the header.

If you want the best response to a question, please check out FAQ222-2244 first.
'If we're supposed to work in Hex, why have we only got A fingers?'
Drive a Steam Roller