/* QSprite.Layout Copyright (c) Alex Movsisyan **************************************************************************** Layout Structure

****************************************************************************/ #wrapper { position:relative; width: 1024px; text-align:left; margin:0 auto; } #header { clear: both; width: 100%; float: left; position: relative; } #col1, #col2, #col3 { position: relative; float: left; padding: 0 0 1em; overflow: hidden; vertical-align: top; } * html #col1, * html #col2, * html #col3 { display:inline; } #footer { clear: both; width: 100%; float: left; position: relative; } /* Layout: 1 column ---------------------------------------------------------------------------*/ .one-col #col1 { width: 100%; } .one-col #col2 { display: none; visibility: hidden; } .one-col #col3 { display: none; visibility: hidden; } /* Layout: 2 column ---------------------------------------------------------------------------*/ .two-col #col1 { width: 22%; } .two-col #col2 { width: auto; min-width: 78%; } .two-col #col3 { display: none; visibility: hidden; } /* Layout: 3 column ---------------------------------------------------------------------------*/ .three-col #col1 { width: 22%; } .three-col #col2 { width: 56%; } .three-col #col3 { width: 22%; } /* Push footer to page bottom ---------------------------------------------------------------------------*/ .basement #footer, #push { height:4em; } /* @media all and (min-width: 0px) { body.l2 #col2 { left:.5em; } body.equal #col1, body.equal #col2, body.equal #col3 { padding-bottom:0!important; margin-bottom:0!important; } body.equal #col1[id^="col1"]:before, body.equal #col2[id^="col2"]:before, body.equal #col3[id^="col3"]:before { content:'Q'; display:block; background:inherit; padding-top:32767px!important; margin-bottom:-32767px!important; height:0; } } */ /* Test: Highlight columns ---------------------------------------------------------------------------*/ .test #header, #test #header { background: #bbb; border-bottom: 1px solid #000; min-height: 20px; } .test #col1, #test #col1 { background: #666; min-height: 100px; } .test #col2, #test #col2 { background: #ccc; min-height: 100px; } .test #col3, #test #col3 { background: #ddd; min-height: 100px; } .test #footer, #test #footer { background: #999; border-top: 1px solid #000; min-height: 20px; }