Friday, January 1, 2010

How do you Code your CSS?

Join GeekyClown's Fan Page on Facebook | Follow me on Twitter
I was just writing some CSS code and thought about how I was typing it out and what works for me. I generally separate all of my different attributes on different lines, like so:

.myCSS
{
font-family: arial;
text-decoration: none;
}

This way I find it easy to go back and pick out attributes. But that got me thinking, how does other developers line up their code. I started going to other Web sites and looking at the source (at the same time it helped since my brain is fried from looking at the screen so long).

I see a lot of one line code:

.myCSS { font-family: arial; text-decoration: none; }

I see some that has all of the CSS together with no line breaks whatsoever.

I thought, how does DreamWeaver line up its CSS? It lines it up more like I do but places the { } differently:

.myCSS {
font-family: Arial, Helvetica, sans-serif;
text-decoration: none;
}

How about Word '07? It is sort of like I do and sort of like DreamWeaver but again moves the { } and also spaces it out differently:

.myCSS
{font-family: Arial, Helvetica, sans-serif;
text-decoration: none;}

I guess in the end, there is no real right way or wrong way to line up your CSS. Since I do all of my coding by hand, I like doing it per separate lines in order to find the attributes quickly when making changes - and as any designer/developer knows when dealing with clients, there are ALWAYS changes. However, there are quite a few sites I found that keep all of the CSS tightly knit in one line. Beauty is in the eye of the coder, I suppose.

1 comment:

  1. I discovered such huge numbers of intriguing stuff in your blog particularly its discourse.
    css beautify

    ReplyDelete