Jonathan Stark

I got a question today from a designer friend who is roughing out a portfolio site and needed some help debugging her CSS. I figured I’d post my answer to her for any CSS n00bs in the audience ;-)

Here’s what I told her:

Hey V -

Here is a link to previews of how your home page looks in just about every known browser:

http://jonathanstark.litmusapp.com/pub/da5b347

You can click on the thumbnails to see a larger view. Overall, I think it looks extremely consistent across all of them.

I did notice a bit of invalid CSS in one of your files:

http://VMKAD.com/HTML/VMKADindexpg3.css

Basically, the issue is that you have some non-zero values specified with a unit of measure. Note the padding values below:

body  {
    padding-top: 40;
    padding-right: 30;
    padding-bottom: 20;
    padding-left: 0;
}

It’s okay to set padding-left to 0 because unit of measure doesn’t matter for 0. i.e. 0px is the same as 0em is the same as 0pt.

However, the padding-top, -right, and -bottom need to have a unit of measure. For example:

body  {
   padding-top: 40px;
   padding-right: 30px;
   padding-bottom: 20px;
   padding-left: 0;
}

HTH!