February 2010

Learn CSS Positioning in Ten Steps

Relationship:

http://www.barelyfitz.com/screencast/html-training/css/positioning/

Learn CSS Positioning in Ten Steps

This tutorial examines the different layout properties available in CSS: position:static, position:relative, position:absolute, and float.

PNG Transparency Fix in IE6

What is this?

This is a IE5.5+ "behavior" that automatically adds near-native PNG support to MSIE 5.5 and 6.0 without any changes to the HTML document itself. Supported features include:

Displaying alpha transparent PNG's in background-image

From reading up on how IE handles png files with Alpha transparency I came to the premature conclusion that I could just add
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader»
(src='myimage.png',sizingMethod='scale');

to every element that needs to be styled with an alpha transparent background image, so for example I could change...

how to use CSS @font-face

Is it Really that Simple? 

LOL ... of course not!

If there's one thing we've all learned about the Internet, nothing is really that simple and embedding fonts using the "new" CSS3 @font-face selector isn't any different.

Min Height Fast Hack

I’ve never been one too keen Grey’s css min-height hack, mainly because of the bulky workaround in your html. Sure hacks can cause bulkier CSS, but I’m ok with that. The problem with Grey’s is that it’s not only a ‘CSS‘ hack (which I’m totally fine with), but it also involves changing your html. I’m none too delighted that you need to add two separate empty div elements just to get this working correctly. Nevermind the matter, he thought of this ages ago when I was still learning how to count to twelve on sesame street. Ok so I learned that like last year, I’m catching on.