[TYPO3-dev] CSS Coding GuidLines

Steffen Kamper steffen at sk-typo3.de
Sun Jun 1 22:12:38 CEST 2008


Hi,

as we don't have CGL for css i would like to initiate that and do a proposal 
here.
As CSS isnt't that complicate syntax, it's short enough to write it down

1. use lower case for all selectors except named classes or id's that use 
camelCase

2. use following formatting rules:

selector[SPACE]{
[TAB]style:[SPACE]value;
}
[empty line]

for more selectors use single lines

selector1,
selector2,
selector3[SPACE]{
[TAB]style:[SPACE]value;
}
[empty line]

3. group styling and comment what they do

/* styling module menu */
...

4. use lower case HEX-values
color: #eeff00;
background-color: #aaa;

These are the formatting rules, but we also need common sense in:
a) use em for dimension for scalable content, use px only for fixed formats
never use pt. 0Values are 0 and not 0px or 0em
b) try to pretend intensive usage of abb. like
background: transparent url('gfx/ol/line.gif') repeat-y top left;
and use single expressions instead:
background-color: transparent;
background-image: url('gfx/ol/line.gif');
etc.


Ok, that's my proposal. Did i forgot something or do you veto for something?
Feel free to comment.

vg Steffen 






More information about the TYPO3-dev mailing list