Forum Moderators: not2easy
Nick_W's CSS Crash Course [webmasterworld.com] is a great place to start. W3Schools also have a good CSS tutorial.
Hanging around the CSS forum here will teach you many usefull tips and techniques, and just diving in and putting some pages together using CSS will quickly familiarise yourself with the basics.
If you just learn using one browser, you may miss out on all the extra hidden "features" (bugs) in various browsers ;)
But definitely worth the effort imho
I learned everything I need to know about CSS right at WebmasterWorld and without having to buy a css book or anything. I now feel confident in teaching peers of mine about it and redesigning all of my sites with css.
Don't think of it as having to learn it, just open up notepad and start playing around with stuff. Start with basic font properties then progress to a full css layout. The trick is to think in your mind what property needs to be set, and if you can't remember how to set it just look it up. You will get the hang of it eventually and won't have to look things up that much.
you can have one of mine but they are real ugly and small
Dave
Allow me to expand it a little: What got me, keeps me and continues to please me about CSS is that it's kind of like a visual programming language.
Part of the attraction of CSS is that to use it properly, you need, must and cannot do without, a thorough understanding of the technology. Which means, learning CSS puts you streets ahead of the competition!
Nick
Here's the templates I use:
DOCTYPES:
(Remember that XHTML1.1 SHOULD be served with an XML MIME type, typically this is application/xhtml+xml, so don't bug me about IE barfing on an XML declaration, since it doesn't understand XML to begin with.)
xhtml.xhtml:
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
html4strict.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
And the body of each looks like:
<head>
<title>foo</title>
<style type="text/css">
/*
* { border: 1px solid purple; }
*/
</style>
</head>
<body>
</body>
</html>
I also use Mozilla's DOM inspector to disect other sites to figure out how they work. The CSS computed style and CSS style rules tabs are very helpful here.
