Have Geek Brain

Browser portability issues

I have a problem with my CSS for a website I am working on .
For some reason, the CSS website works for FF 3 and IE 7, but of course MS is complicating things as it doesn't work for IE 6. The
header looks squashed.
The trouble is my client owns IE 6 and I screamed without knowing why. My questions:

  • Where can I get the test suite for all browsers?
  • How to fix it? Can someone check this for me?

Here's the CSS for IE:

/* CSS Document */

#presentation{
position: relative;
margin: 0 auto;
width: 689px;
height: 586px;
z-index: 0;
}

#pretext{
position: absolute;
padding: 20px;
}

#cleft{
width:97px;
height:665px;
position: relative;
float: left;
}

#cright{
width:97px;
height:665px;
position: relative;
float: right;
}

Here is the html:
EDIT SO mess with html.
Here is pastebin

0


a source to share


6 answers


To solve your first problem: I would recommend using a browser specific stylesheet.

Since you are using XHTML you can use the following:

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

The CSS file lte-ie-6.css

will then only be read by IE6. You can use it to easily override other CSS that is causing visual errors in IE6.



There is software such as MultipleIE , Internet Explorer Collection and IETester that can emulate different versions of IE. However, this does not always give accurate results. Microsoft's official answer to your last question is to install Virtual PC and run IE6 on it .

Lately Microsoft has been working on SuperPreview, the official website preview utility that does the same thing, but with reliable results. Read about SuperPreview and / or download it .

+1


a source


Use IETester to test it yourself :)



+2


a source


There is no easy answer to this problem, I'm afraid. My advice to you:

  • Code using the smallest set of methods you need to do what you want.
  • Make your standards compliant.
  • Do at least some testing on every browser (+ version) you need to support.
  • Write a complaint letter to Microsoft's Steve Balmer about IE. (Every self-respecting web developer should do this.)

Hello

+1


a source


Welcome to the world of CSS quirks browsers. It is difficult to get a good working CSS based website that is browser compatible. You need to experiment a lot.

Sometimes you might be better off using a CSS framework like BlueprintCSS

Try browsing your site in different browsers on different platforms using the BrowserShots service .

+1


a source


Multiple IE makes it easy to install / run multiple versions of IE side by side.

0


a source


I looked and one of your stylesheets set the height and width for #logopic

#logopic{
width: 50%;
height: auto;
vertical-align:bottom;}

Try real image height and width instead

width:699px;
height:126px;
0


a source






More articles:


All Articles