分かりやすいCSSコードを書くための５つの方法

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td { margin: 0; padding: 0; }

* { margin: 0; padding: 0; }  

div#header h1 {
    z-index: 101;
    color: #000;
    position: relative;
    line-height: 24px;
    margin-right: 48px;
    border-bottom: 1px solid #dedede;
    font-size: 18px;
}

div#header h1 {
    border-bottom: 1px solid #dedede;
    color: #000;
    font-size: 18px;
    line-height: 24px;
    margin-right: 48px;
    position: relative;
    z-index: 101;
}

/*****Reset（リセット定義）*****/
要素のリセットCSS定義

/*****Basic Elements（基本要素定義）*****/
body, h1-h6, ul, ol, a, pなどの一般的な要素のCSS定義

/*****Generic Classes*****/
共通系CSS定義 

/*****Basic Layout（基本レイアウト定義）*****/
レイアウト関連のCSS定義

/*****Header（ヘッダ定義）*****/
ヘッダ部要素のCSS定義

/*****Content（コンテンツ定義）*****/
コンテンツ・エリア要素のCSS定義

/*****Footer（フッター定義）*****/
フッター部要素のCSS定義

/*****Etc（その他定義）*****/
その他CSS定義

div#header { float: left; width: 100%; }
div#header h1 { float: left; position: relative; width: 250px; }

div#header div.column {
    border-right: 1px solid #ccc;
    float: right;
    margin-right: 50px;
    padding: 10px;
    width: 300px;
}