HTML Hacks
1. The problem with Min-width in Internet Explorer
IE understands this property as width. But the following hack works:
#page { width: expression (((document.documentElement.clientWidth || document.body.clientWidth) < 780)? "780px": "100 %") }
Validator would charge this as not valid, therefore I advise to transfer it into HTML code:
<!--[if gte IE 5]> <style type="text/css"> #page {width: expression(((document.documentElement.clientWidth || document.body.clientWidth) < 780)? "780px" : "100%")} </style> < ![endif]--> </style>
From the first page loading IE5 does not know what clientWidth is, therefore it is necessary to address to this size in <head> with the help of JavaScript:
<script language="JavaScript" type="text/javascript"> <!-- document.body.clientWidth; //--> </script>
2. IE hacks
Two blocks are located near and have the property float: left;.
The space of the first from edge margin-left: 20px; the second from the first - margin-left: 10px;.
The space between first and second blocks in result turns out 30px in IE. I.e. summation takes place.
Hack for IE5: IE5 feature is that the width of the block equals width, spaces and borders, in other browsers - only width
#menu {width: 150px; voice-family: "\"} \""; voice-family: inherit; width: 140px} html> body #menu {width: 140px}
150px is only for IE5, it does not understand anything after voice-family.
The second line is necessary to return IE5 to life: without it the next to the first line will be ignored.
3. Opera hacks
html>body .cls {color: red} /* works in Opera, Mozilla, IE7+ */ html:root .cls {color: green} /* works only in Mozilla and Opera 9+*/
4. FF hack
.cls, x:-moz-any-link {color: red} /* works only in Mozilla */
5. The block in the middle of a browser window
body { text-align: center; } /* the block will be in the center in IE5 */ #block { text-align: left; width: 780px; margin: 0px auto }/* the block will be in the center in other browsers */
It is also possible to specify the width of the block in percentage.
6. If you would like to make the button border invisible in Opera:
input.btn {border: 0px solid transparent;}