Internet Explorer and issues on width and height
This text below is good preparation for handling the IE height/width issues. The wiki now comes into a div in geoT that has controlled width expansion.
Put the css in the head with conditionals and you're set. IF it goes in the CSS linked page it will work but invalidate the CSS. This has been fixed in IE7 so your conditional can target "less than IE7"
3. Minimum width for a page
A very handy CSS command that exists is the min-width command, whereby you can specify a minimum width for any element. This can be particularly useful for specifying a minimum width for a page.
Unfortunately, IE doesn't understand this command, so we'll need to come up with a new way of making this work in this browser. First, we'll insert a <div> under the <body> tag, as we can't assign a minimum width to the <body>:
<body> <div id="container">
Next we create our CSS commands, so as to create a minimum width of 600px:
#container { min-width: 600px; width:expression(document.body.clientWidth < 600? "600px": "auto" ); }
The first command is the regular minimum width command; the second is a short JavaScript command that only IE understands. Do note though, this command will cause your CSS document to invalidate so you may prefer to insert it into the head of each HTML document to get round this.
You might also want to combine this minimum width with a maximum width:
#container { min-width: 600px; max-width: 1200px; width:expression(document.body.clientWidth < 600? "600px" : document.body.clientWidth > 1200? "1200px" : "auto"); }
4. IE and width & height issues
IE has a rather strange way of doing things. It doesn't understand the min-width and min-height commands, but instead interprets width and height as min-width and min-height - go figure!
This can cause problems, because we may need boxes to be resizable should more text need to go in them or should the user resize text. If we only use the width and height commands on a box then non-IE browsers won't allow the box to resize. If we only use the min-width and min-height commands though then we can't control the width or height in IE!
This can be especially problematic when using background images. If you're using a background image that's 80px wide and 35px high, then you'll want to make sure that the default size for a box using this image is exactly 80 x 35px. However, if users resize the text then the box size will need to expand gracefully.
To resolve this problem, you can use the following code for a box with class="box":
..box { width: 80px; height: 35px; }
html>body .box { width: auto; height: auto; min-width: 80px; min-height: 35px; }
All browsers will read through the first CSS rule but IE will ignore the second rule because it makes use of the child selector command9. Non-IE browsers will read through the second one and will override the values from the first rule because this CSS rule is more specific, and CSS rules that are more specific always override those that are less specific.
Source:
See more usefule info in "Ten CSS tricks you may not know"
http://www.webcredible.co.uk/user-friendly-resources/css/css-tricks.shtml
and also "Ten more…"
http://www.webcredible.co.uk/user-friendly-resources/css/