themes/democratica/layout.css

   1 /* $Id: layout.css,v 1.1 2005/03/25 01:06:43 kbahey Exp $ */
   2 /* Democratica Layout Styles */
   3
   4 * {
   5   zoom: 1; /* IE peekaboo fix */
   6 }
   7 body {
   8   margin: 0;
   9   padding: 0;
  10   background: url(images/bg.png) repeat;
  11 }
  12 /**
  13
  14 I'm using a mix of Dan Cederholm's Faux Columns for the background image
  15 from http://www.alistapart.com/articles/fauxcolumns/ and Ryan Brill's
  16 "Creating Liquid Layouts with Negative Margins" for the 3-column
  17 layout from http://www.alistapart.com/articles/negativemargins/
  18
  19 **/
  20 #outer-wrapper {
  21   width: 94%;
  22   _width: expression( ( documentElement.clientWidth < 760 ) ? "760px" : "auto" ); /* IE min-width hack */
  23   min-width: 760px;
  24   max-width:1200px;
  25   margin: 10px;
  26   margin-left: auto;
  27   margin-right: auto;
  28   padding: 0;
  29 }
  30 #wrapper {
  31   padding-top: 9px;
  32   _padding-top: 0;
  33   background: url(images/bg_footer.png) repeat-x top left;
  34
  35 }
  36 #container {
  37   width: 100%;
  38   float: left;
  39   background-color: #fff;
  40 }
  41 #content {
  42   padding: 10px 0;
  43 }
  44 #sidebar-left {
  45   margin-right: -1px;
  46   border-right: 1px solid #bababa;
  47 }
  48 #notices {
  49   margin: 0;
  50   clear: left;
  51   padding: 14px 10px;
  52   background: url(images/bg_footer.png) repeat-x top left;
  53 }
  54 /*<group=Left Column Only Styles>*/
  55 body.layout-left #sidebar-right {
  56   display: none;
  57 }
  58 body.layout-left #content {
  59   margin-right: 1.0em;
  60 }
  61 #sidebar-left {
  62   background: url(images/bg_left.png) left repeat-y; /* needed for sidebar-left bg color */
  63   padding: 0;
  64 /*  padding-right: 7px; */
  65 }
  66
  67 /*</group>*/
  68 /*<group=Right Column Only Styles>*/
  69
  70 /**
  71
  72 Right Column Only Layout
  73
  74 **/
  75 body.layout-right #sidebar-left {
  76   display: none;
  77 }
  78 body.layout-right #content {
  79   margin-left: 1.0em;
  80 }
  81
  82 /*</group>*/
  83 /*<group=Shared Layout Styles>*/
  84 /*<group=Right Styles>*/
  85 body.layout-both #content, body.layout-right #content {
  86   margin-right: 280px; /* This must match container margin-right */
  87 }
  88 body.layout-both #container, body.layout-right #container {
  89   margin-right: -280px;  /* This must match content's margin-right */
  90   background: #fff url(images/bg_right.png) top right repeat-y;
  91 }
  92 body.layout-both #sidebar-right, body.layout-right #sidebar-right {
  93   float: right;
  94   width: 270px; /* This must be less than content's margin-right */
  95 }
  96 body.layout-right #navigation {
  97   margin-left: 1.5em;
  98   margin-bottom: 1.0em;
  99 }
 100
 101 /*</group>*/
 102 /*<group=Left Styles>*/
 103 body.layout-both #content, body.layout-left #content {
 104   background: url(images/bg_left.png) left repeat-y; /* needed for sidebar-left bg color */
 105 }
 106 body.layout-both #main-content, body.layout-left #main-content {
 107   margin-left: 170px;
 108 }
 109 body.layout-both #sidebar-left, body.layout-left #sidebar-left {
 110   display: block;
 111   width: 150px;
 112   float: left;
 113   padding-left: 6px;
 114 }
 115 body.layout-left #outer-wrapper, body.layout-right #outer-wrapper {
 116   width: 80%;
 117 }
 118
 119 /*</group>*/
 120
 121 /*</group>*/
 122
 123 /*<group=Utility>*/
 124 .hide {
 125   display: none;
 126 }
 127 br.clear {
 128   clear: both;
 129 }
 130 .clearing {
 131   height: 0;
 132   clear: both;
 133   font-size: 0;
 134 }
 135      /*</group>*/