A to Z of Cascading Style Sheets

21 September 2006

Partly inspired by a recent article on A List Apart, here's my unofficial A to Z of CSS. Before anyone says, I actually do like working with CSS....

A is for Alternative Style Sheet.
I can use more than one style sheet if I want to.
B is for Box Model Hack.
If only browsers would play by the rules.
C is for Cascading.
There's a hierachy, don't you know.
D is for Descendant Selector.
One of those terms that makes you sound like an expert.
E is for Elastic Design Layout.
We can cope with anything that our web visitors do with their browser text size.
F is for Font Tag.
No need to use these any more.
G is for Grouping.
It's easier if you don't write the same styles out again and again.
H is for How To Clear Floats.
I never needed to do this before CSS.
I is for Inline Style.
Use this if your HTML element doesn't behave the way it should.
J is for JavaScript.
When you have finished, let's allow the user to change the CSS properties of your page.
K is for Keywords.
It's really 'old hat' to use numbers for text sizes any more.
L is for Layout.
Fixed, fluid, two column, three column. Why are things so complicated?
M is for Margin.
Move things round on your webpage really nicely.
N is for Negative Positioning.
Only to be used if you cannot get your layout to work any other way.
O is for Opposing Floats.
Nothing to do with South American carnivals but a method for moving things to left and right.
P is for Padding.
It's like a margin, but inside the box.
Q is for Questions.
You're sure to have a few after you start learning CSS.
R is for Rules.
As in 'Be Nice to Opera Rule'.
S is for Style Sheet.
Can only be created by hand coding.
T is for Table.
The old way of doing things but, in fact, quite useful for displaying data.
U is for Unordered List.
It's amazing what you can do with these.
V is for Validation.
Get one of those trendy CSS validation badges for your website.
W is for Wrapper Div.
Can't get your layout to work? You probably need this.
X is for XHTML.
X for 'xtra special HTML.
Y is for Y axis.
Use with background images.
Z is for Zen Garden.
Take a designer, give them some HTML and a stylesheet - wait for some beautiful designs.

Don't take this too seriously. It's tongue-in-cheek after all. However, you may have a better version that is inspired by your own experiences. Let's hear it.

Try FREE for 30 days. SugarSync Online Backup and Sync. Get up to 10 GB free storage!

Comments

  1. I’ve just been checking my analytics and it looks like we’re famous in Italy. www.html.it have us listed in their blog as part of a growing trend of A-Z’ers.

    More here


    · Ed    6 October 2006, 19:48    1

  2. Yes, I saw that. Fame at last eh?!


    · CVW    7 October 2006, 12:59    2
Textile Help