/ CSS

Two general hacks for IE6 and IE7 that you should't miss

There are all kind of CSS hacks regarding IE6 and IE7 over the Internet. What provoke me to write a note about it was a problem that I explored and couldn't easily find the solution.

In general the two major hacks for these two versions of Internet Explorer are * html (for IE 6) and *+html (for IE7). But the second hack depends on the mode, that browser was loaded - your page should be at Standards mode if you want it to work.

For understanding in what mode is particular browser loading your page, please read Activating Browser Modes with Doctype.

CSS code below is going to work fine, if you have problems with both IE6 and IE7 and your page is loaded at Standards mode.

	/* All browsers */
	.yourClassName {
		/* code goes here */
	}
	
	/* Fix styles to IE6 in both modes and IE7 in quirks mode */
	* html .yourClassName {   
		/* code goes here */  
	}   
	
	/* Fix IE7 Only in Standards mode */  
	*+html .yourClassName {  
		/* code goes here */  
	}   

CSS Naked Day '07

CSS Zen Garden

This is maybe one of the best sources of pure CSS exaples. CSS Zen Garden is a display of the power and beauty of CSS. The concept is simple - you can see in many different ways designed the exact same HTML code and produced completely different looking pages. As you browse through the various designs, you will find that the only thing changing the way each page looks is the CSS file.

Pure CSS popups

CSS absolute center

I had half day problems and wondering how to center one "under construction" picture with CSS only, before near one month. And here is what I found as a decision. I haven't tеsted it with MAC browsers and the most problematic one - IE5 for me.

body { 
	background-color: #fff; 
} 
#center {   
	width:680px;   
	height:540px;  
	position:absolute; 
	top:50%;   
	left:50%;   
	margin:-270px auto auto -340px;   
	text-align:center; 
} 
....
<div id="center">  
	<img src="img.jpg" width="680" height="540" />  
</div> 
....