Web Fonts

One of the sites that I am editing right now is very heavily based on fonts. I need to have the right fonts in the right places or my client wont be happy. But I find fonts to be such a pain. Which fonts are 'web safe'? What happens if a user doesn't have the right font installed? As I was coding the site I ran across a great article entitled "The Myth Of ‘Web-Safe’ Fonts". It's worth a read for anyone interested in making sure that fonts display properly on their pages. Most interesting was the discussion of the five 'font family stacks' and the three types of fonts that a browser can fall back to if the proper font isn't installed.

Making a DIV 100% of the Document Height

A friend told me that IE 8 is supposed to be fully compliant with CSS. I went to test a website on Browsershots the other day and discovered that it didn't work in IE 7 or 8. So much for compliance. The problem I have is that the height of my main div is set to 100% but it only goes part way down the page and then ends while its content continues. Its a bit difficult to explain so hopefully it will make more sense if you look at the image on the left.
The white background is supposed to go to the end of the page, since all of the other page elements are enclosed in it.

The Solution
I couldn't find a way to fix this problem using CSS/HTML alone. Instead I had to use a piece of javascript to resize the div to the actual height of the page.

<script type="text/javascript">
function resize()
{
document.getElementById('maindiv').style.height =
document.body.parentNode.scrollHeight + 'px';
}
</script>

Just let your body tag know that it should run the resize function onload and the result in IE 7 and 8 is as follows:

First Steps - Creating Web Sites

Getting started with computer programming can be a challenge. Where is the best place to start? Designing websites is an easy way to see quick results for your efforts. The most basic way to get started with web design is to use a WYSIWYG (What You See Is What You Get) web editor. Dreamweaver is the champion of this type of software. For the amateur who is just beginning the open source NVU should do fine. However, I highly recommend that you learn to create your own websites using only a text editor and html, javascript, and php. The most difficult part of learning to design web pages will be finding the right sites to learn from.

Learn HTML - DaveSite.com

I highly recommend using DaveSite.com for an HTML tutorial because it assumes no prior knowledge and emphasizes practical application.

Learn CSS - DaveSite.com

CSS is an important part of defining the layout of your web page. To find out more about CSS and how to use it use Dave's tutorial. Visit the W3Schools website for more tutorial and a handy reference guide.

Learn Javascript - Thau's Javascript Tutorial

Thau's Javascript Tutorial on Webmonkey.com was by far the best Javascript tutorial I could find. Once you've completed it you can move on to the Advanced Javascript Tutorial.

Learn PHP - PHP From the Ground Up

By now we are getting into designing more advanced websites. Many websites will not require PHP or another server side language. If you feel limited by the capabilities of html and javascript then it's time to check out this tutorial.