height:auto !important;
height: (the min height value);

You’ll be able to get it to work, an example would be:

.classname {
min-height:200px;
height:auto !important;
height:200px;
}

IE Tester

http://my-debugbar.com/wiki/IETester/HomePage

This is a test browser that emulates the following IE browsers: IE 5.5, 6, 7 and 8, which I use for testing builds. Unfortunately this testing browser is only available on Windows based machines, however it does run on the three major operating systems; XP, Vista and 7. Their is an alternative option called multiple Internet Explorers which found here http://tredosoft.com/Multiple_IE this allows you to install multiple versions of the IE browser on your PC however unlike IE tester it only works on Windows XP.

Due to the tabbed layout of IE tester, allowing you to render the different browser versions in the same window on different tabs I prefer this option. IE Tester isn’t fool proof, and I would always recommend finding a PC running a version IE 6 as it’s default browser over it, however it gives you a good indication of general IE6 errors such as the double margin bug.

CSS browser selector

http://rafael.adm.br/css_browser_selector/

This is a piece of javascript which gives you the ability to write specific CSS code for each operating system and each browser. Allowing you to specify IE6 specific styles without the use of conditional comments, this is how I deal with those tricky bugs which cannot be solved with additional lines of css such as display: inline.

It is also worth noting that it may be possible to ignore the browser completely, I recommend looking at a site’s analytics before starting a new design/build. For example my website only got 60 visits from users using IE6 last month whereas I had 3,501 visitors using Firefox, this had led me to drop support for IE6 on my site.

What is Typekit?

Typekit is a new javascript based solution for using non web safe fonts on websites, you create your “kit” by selecting the fonts available on the Typekit website. After this Typekit will then generate a line of JavaScript for you to embed into you site, you can then add a selector to your CSS to tell Typekit where you would like the font to be applied.

You can read up more about it here at the official blog:

http://blog.typekit.com/

To have one of the free invites please respond to this post.

Update

All the invites have now been given out.

I’m happy to release this W3C valid XHTML & CSS template, this is a bare template featuring a header, sidebar, main text area and footer for you to style as you wish. This template is ideal for those who are new to XHTML and CSS  programming, you can take it and easily style it meet your needs. It’s not a fluid template however it does feature percentages and ems, for div widths and text sizing. This template has been tested in IE 6, IE 7, Firefox and Safari, and it has passed the W3C CSS validation test and the W3C XHTML validation test.

A demo can be seen here.

And the zip file can be downloaded here.

However for £1.79 its a great app probably the best that I’ve ever brought, and great for killing time during a long commute, below are some of the doodles I was doing today, hardly masterpieces:

Original

Retouched version

Ems are a unit of measurement in the field of typography, equal to the point size of the current font. This unit is not defined in terms of any specific typeface, and therefore is the same for all fonts at the given point size.

What are the benefits of ems?

The main benefit of ems is keeping the text consistent across all the major browsers when the user increases/decreases the size of the text on a web page.

How I use ems

Now before you start to use ems in your builds its important to note that my default 1 em = 16 pixels.

I have noticed that various programmers have there own methods to make their CSS ready for ems, personally I do the following:

Create a “html” tag make the font size 100%, I then create a “body” tag with the font size as 1 em this solves the notorious font re-sizing issues that IE6 users experience. Now my body tag has a value of 1 em, and remember 1 em = 16 pixels. From this I can now work out the em values that the rest of my text should have.

As I’ve never been one for maths, I tend to use a em calculator, one can be found here, others are out there, this saves you having to work out the value through using the em formula, alternatively you can look at a em conversion table such as the one found here. When using a em calculator you have to start by specifying the body value, which as stated above I’m going to have as 16 pixels (1 em). Once this value is specified we can then branch off it by creating a new nodes, in which we can enter a new value such as 14 pixels. When entering a new pixel value into a node you will be given in return the relevant em value, which in the case of 14 pixels will be 0.88 em.