How to shorten my css codes?

[metta]

I have the following css codes:

/* special_size.tpl */
#special_size  h2 { background: transparent url('../img/block_header_large2.gif')  no-repeat top left; }
#special_size #right_column { display: none; }
#special_size #center_column {
   width: 767px;
   margin: 0 0 30px 0;
   text-align: left;
    float:left;
}

/* material.tpl */
#material h2 { background: transparent url('../img/block_header_large2.gif')  no-repeat top left; }
#material #right_column { display: none; }
#material #center_column {
    width: 767px;
   margin: 0 0 30px 0;
   text-align: left;
    float:left;
}

How can I combine these two since they are using the same codes?

[JAKCRABBIT]

http://jigsaw.w3.org/css-validator/

[Eihwaz]

Use comma for your selectors:

#special_size h2, #material h2 {
   background: transparent url('../img/block_header_large2.gif')  no-repeat top left;
}
#special_size #right_column, #material #right_column {
   display: none;
}
#special_size #center_column, #material #center_column {
   width: 767px;
   margin: 0 0 30px 0;
   text-align: left;
   float:left;
}

You can also shorten margin attributes like this:

margin: 0 0 30px;

Margins and paddings rule:
T stands for Top, R - right, B - bottom, L - left
1 set (margin: 5px;): T R B L
2 set (margin: 10px, 5px;): (T (L R) (Top and Bottom: 10px margin, left and right: 5px margin)
3 set (margin: 10px, 5px, 8px;): T (L R) B (Top: 10px, Left and Right: 5px, Bottom: 8px;)
4 set: T R B L

[metta]

Use comma for your selectors:

#special_size h2, #material h2 {
   background: transparent url('../img/block_header_large2.gif')  no-repeat top left;
}
#special_size #right_column, #material #right_column {
   display: none;
}
#special_size #center_column, #material #center_column {
   width: 767px;
   margin: 0 0 30px 0;
   text-align: left;
   float:left;
}

You can also shorten margin attributes like this:

margin: 0 0 30px;

Margins and paddings rule:
T stands for Top, R - right, B - bottom, L - left
1 set (margin: 5px;): T R B L
2 set (margin: 10px, 5px;): (T (L R) (Top and Bottom: 10px margin, left and right: 5px margin)
3 set (margin: 10px, 5px, 8px;): T (L R) B (Top: 10px, Left and Right: 5px, Bottom: 8px;)
4 set: T R B L

Wow, thank you. You just taught me a lot. Thank you again.