css for group layout

group-layout.css

/* group style
----------------------------------*/
div.group {
    display: block;
    float: left; 
}
div.group > h3.group-header {
    margin: 8px;
    margin-bottom: -8px;
    border: 1px;
    border-bottom: 0px;
    padding: 4px 8px;
    
    color: #959595;
    background-color: transparent;
    
    border-radius: 0px;
    border-style: solid;
    border-color: transparent;
    
    font-size: small;
    font-weight: bold;
    text-align: left;
}
div.group > div.group-content {
    margin: 8px;     
    border: 1px;
    padding: 8px; 
    
    color: black;
    background-color: #e4e4e4;
    
    border-radius: 0px;
    border-style: solid;
    border-color: lightgrey;
    
    display: block;
    float: left; 
    
}



/* column style
----------------------------------*/
div.column { 
    display: block;
    float: left; 
}



/* column in group style
----------------------------------*/
div.group > div.group-content > div.column:first-child,
div.group > div.group-content > div.column.first-child {
    margin-left: 0px !important;  
    /* first-child class is a fix for IE6's and IE7's lack of first-child css selector */
    /* class is set onload by jquery */
}
div.group > div.group-content > div.column {
    margin: 0px 17px; /* add margin between two columns */  
    border: 0px;
    padding: 0px; 
    
    display: block;
    float: left;
}
div.group > div.group-content > div.column:last-child,
div.group > div.group-content > div.column.last-child {
    margin-right: 0px !important;   
    /* last-child class is a fix for IE6's, IE7's and  IE8's lack of last-child css selector */
    /* class is set onload by jquery */
}



/* linebreaks
----------------------------------*/
div.group {
    clear: both;
}
form > div.form-content > div.column {
    clear: both;
}
form > div.form-content > div.column ~ div.column {
    clear: none;
    /* WORKAROUND: n:th-child supported in IE6, IE7 and IE8 hence use div.column ~ div.column selector temporarly */
    /* TODO: add n:th-child support with jquery and add linebreak at n=2 */
}