ブロックの開始位置

selector {

selector{

selector
{

セレクタがひとつのときは二番目でもいいのですが、二つ以上のセレクタをカンマ区切りで連ねるときにカンマの後ろにスペースが欲しいので、バランス的に波括弧の前にもスペースがひとつ欲しくなります。セレクタのあとに改行する三つ目は、ただでさえ縦長になるCSSの傾向をさらに強めることになるのでやめておきます。

宣言部

selector {
  property: value;

selector {
property : value;
property :value;

行頭をインデントするか、コロンの前後にスペースをいれるか、という二つが問題ですが、全パターン列挙するのは面倒なので省略しました。前者については、インデントしたほうが明らかに見やすくなるのでそうします。あ、インデントはスペース二つにしてます。

後者は、PEP 8（Pythonのスタイルガイド）でコロンの前にスペースを入れずコロンの後ろに入れることを推奨しているので、それを踏襲します。というか一般的にコロンの使い方としてそれが普通みたいですね。

ブロックの中で一番後ろのセミコロンは省略できるのですが、書き足すときにトラブルの元になりますから、きちんと書きます。

ブロックの終了位置

selector {
  property: value;
}

selector {
  property: value;}

selector {
  property: value; }

後ろ二つは確かに縦に短くはなるのですが、後ろに書き足す際にカーソルを移動する手間と改行する手間が増えてしまいます。

値

selector {
  property: value, value, value;
}

selector {
  property: value,value,value;
}

どっちが見やすいか一目瞭然ですね。宣言部と同じ理由で、カンマの前にはスペースを入れません。

こういうシンプルなケースではこれでいいのですが、ネストされているパターンは少し複雑です。

color: rgb(255,255,255);
background-image: linear-gradient(180deg,
                                  red 0%,
                                  rgba(255,0,0,0) 100%),
                  gradient(linear, left top, left bottom,
                           from(rgb(255,255,255)),
                           to(rgb(0,0,0)));

ケースバイケースですが、個人的にこの場合はこう書くのが一番すっきりします。RGB(a)値はスペースなし。これにスペースを加えるとネストしたときに区切り位置が分かりづらくなりますし、逆にRGB以外のスペースをなくすと酷いことになります。上の例だと:

gradient(linear,left top,left bottom)

かなり読みづらい。（そもそもスペース区切りとカンマ区切りが混在してるのが気持ち悪いのですが……）

改行位置もテキトーでいいんじゃないですかね。投げやりですが。fromとto、0%と100％のみで中間（color-stop/1-99%）がないときは一行にまとめてもいいかもしれません。（Vendor Prefixをつけるとインデントが深くなるので厳しいか……？）