lib/yui/grids/grids.css

   1 /*
   2 Copyright (c) 2007, Yahoo! Inc. All rights reserved.
   3 Code licensed under the BSD License:
   4 http://developer.yahoo.net/yui/license.txt
   5 version: 2.3.0
   6 */
   7 /* for all templates and grids */
   8 body{text-align:center;}
   9 #ft{clear:both;}
  10 /**/
  11 /* 750 centered, and backward compatibility */
  12 #doc,#doc2,#doc3,#doc4,.yui-t1,.yui-t2,.yui-t3,.yui-t4,.yui-t5,.yui-t6,.yui-t7 {
  13         margin:auto;text-align:left;
  14         width:57.69em;*width:56.301em;min-width:750px;}
  15 /* 950 centered */
  16 #doc2 {
  17         width:73.074em;*width:71.313em;}
  18 /* 100% with 10px viewport side matting */
  19 #doc3 {
  20         margin:auto 10px; /* not for structure, but so content doesn't bleed to edge */
  21         width:auto;}
  22 /* 974 centered */
  23 #doc4 {
  24         width:74.923em;*width:73.117em;}
  25
  26 /* below required for all fluid grids; adjust widths and margins above accordingly */
  27
  28         /* to preserve source-order independence for Gecko */
  29         .yui-b{position:relative;}
  30         .yui-b{_position:static;} /* for IE < 7 */
  31         #yui-main .yui-b{position:static;}
  32
  33 #yui-main {width:100%;}
  34 .yui-t1 #yui-main,
  35 .yui-t2 #yui-main,
  36 .yui-t3 #yui-main{float:right;margin-left:-25em;/* IE: preserve layout at narrow widths */}
  37
  38 .yui-t4 #yui-main,
  39 .yui-t5 #yui-main,
  40 .yui-t6 #yui-main{float:left;margin-right:-25em;/* IE: preserve layout at narrow widths */}
  41
  42 .yui-t1 .yui-b {
  43         float:left;
  44     width:12.3207em;*width:12.0106em;}
  45 .yui-t1 #yui-main .yui-b{
  46     margin-left:13.3207em;*margin-left:13.0106em;
  47 }
  48
  49 .yui-t2 .yui-b {
  50         float:left;
  51     width:13.8456em;*width:13.512em;}
  52 .yui-t2 #yui-main .yui-b {
  53     margin-left:14.8456em;*margin-left:14.512em;
  54 }
  55
  56 .yui-t3 .yui-b {
  57         float:left;
  58     width:23.0759em;*width:22.52em;}
  59 .yui-t3 #yui-main .yui-b {
  60     margin-left:24.0759em;*margin-left:23.52em;
  61 }
  62
  63 .yui-t4 .yui-b {
  64         float:right;
  65     width:13.8456em;*width:13.512em;}
  66 .yui-t4 #yui-main .yui-b {
  67     margin-right:14.8456em;*margin-right:14.512em;
  68 }
  69
  70 .yui-t5 .yui-b {
  71         float:right;
  72     width:18.4608em;*width:18.016em;}
  73 .yui-t5 #yui-main .yui-b {
  74     margin-right:19.4608em;*margin-right:19.016em;
  75 }
  76
  77 .yui-t6 .yui-b {
  78         float:right;
  79     width:23.0759em;*width:22.52em;}
  80 .yui-t6 #yui-main .yui-b {
  81     margin-right:24.0759em;*margin-right:23.52em;
  82 }
  83
  84 .yui-t7 #yui-main .yui-b {
  85         display:block;margin:0 0 1em 0;
  86 }
  87 #yui-main .yui-b {float:none;width:auto;}
  88 /* GRIDS (not TEMPLATES) */
  89
  90 .yui-gb .yui-g,/*new for nesting normal grids in special grids*/
  91 .yui-gb .yui-gb,/*new for nesting normal grids in special grids*/
  92 .yui-gb .yui-u,
  93 .yui-g .yui-gb .yui-u,
  94 .yui-gb .yui-gc,
  95 .yui-gb .yui-gd,
  96 .yui-gb .yui-ge,
  97 .yui-gb .yui-gf,
  98 .yui-gc .yui-u,
  99 .yui-gc .yui-g,
 100 .yui-gd .yui-u{float:left;margin-left:2%;width:32%;}
 101
 102 .yui-gb .yui-gb .yui-u,
 103 .yui-gb .yui-gc .yui-u {_margin-left:1.2%;*margin-left:1.7%;}
 104 .yui-g .yui-gb .yui-u {_margin-left:.8%;} /* for #8-10 for IE6 */
 105 .yui-gb .yui-u {margin-left:2%;width:32%;float:right;*width:31.8%;}
 106 .yui-gb div.first {margin-left:0;*margin-right:1px;float:left;}
 107 .yui-gb .yui-gb div.first {*margin-right:0;width:31.7%;} /* for #29 for IE7*/
 108 .yui-gb .yui-gc div.first, /* for #41 for IE7 */
 109 .yui-gb .yui-gd div.first  /* for #40 for IE7 */
 110          {*margin-right:0;}
 111
 112 .yui-g .yui-gc div.first,
 113 .yui-g .yui-ge div.first {float:left;}
 114
 115 .yui-gb .yui-gd .yui-u {*width:66%;_width:61.2%;}
 116 .yui-gb .yui-gd div.first {*width:31%;_width:29.5%;}
 117
 118 .yui-gb .yui-gc .yui-u,
 119 .yui-g .yui-gc .yui-u {_float:right;width:32%;_width:29.9%;}
 120 .yui-gb .yui-gc div.first {width:66%;*width:64.5%;*float:left;*margin-left:0;}
 121 .yui-gb .yui-ge .yui-u,
 122 .yui-gb .yui-gf .yui-u {margin:0;}
 123
 124         /*Float units (and sub grids) to the right */
 125         .yui-g .yui-u,
 126         .yui-g .yui-g,
 127         .yui-g .yui-gb,
 128         .yui-g .yui-gc,
 129         .yui-g .yui-gd,
 130         .yui-g .yui-ge,
 131         .yui-g .yui-gf,
 132         .yui-gc .yui-u,
 133         .yui-gd .yui-g,
 134         .yui-g .yui-gc .yui-u,
 135         .yui-ge .yui-u,
 136         .yui-ge .yui-g,
 137         .yui-gf .yui-g,
 138         .yui-gf .yui-u{float:right;display:inline;}
 139
 140         /*Float units (and sub grids) to the left */
 141         .yui-g div.first,
 142         .yui-g div.first,
 143         .yui-gc div.first,
 144         .yui-gc div.first div.first,
 145         .yui-gd div.first,
 146         .yui-ge div.first,
 147         .yui-gf div.first{float:left;}
 148
 149 .yui-g .yui-g .yui-u,
 150 .yui-gb .yui-g .yui-u,
 151 .yui-gc .yui-g .yui-u,
 152 .yui-gd .yui-g .yui-u,
 153 .yui-ge .yui-g .yui-u,
 154 .yui-gf .yui-g .yui-u {width:48.1%;*margin-left:0;}
 155 .yui-g .yui-g div.first {*margin:0;}
 156 .yui-gb .yui-g div.first {*margin-right:1px;}
 157
 158 .yui-gb .yui-gb .yui-u {_margin-left:.7%;} /* for #23-32 for IE6*/
 159 .yui-gb .yui-g div.first, /* for #23 for IE6*/
 160 .yui-gb .yui-gb div.first {*margin-left:0;}
 161
 162 .yui-gc .yui-g .yui-u,
 163 .yui-gd .yui-g .yui-u {_width:48.1%;*width:48.1%;*margin-left:0;}
 164
 165 .yui-g .yui-u,
 166 .yui-g .yui-g,
 167 .yui-g .yui-gb,
 168 .yui-g .yui-gc,
 169 .yui-g .yui-gd,
 170 .yui-g .yui-ge,
 171 .yui-g .yui-gf {width:49.1%;}
 172
 173 .yui-g .yui-gb div.first,
 174        .yui-gb div.first,
 175        .yui-gc div.first,
 176        .yui-gd div.first {margin-left:0;}
 177
 178 .yui-g .yui-gc div.first,
 179 .yui-gc div.first,
 180 .yui-gd .yui-g, /* for 056, 057 */
 181 .yui-gd .yui-u {width:66%;}
 182
 183 .yui-gd div.first,
 184 .yui-gb .yui-gd div.first {width:32%;}
 185 .yui-g .yui-gd div.first {_width:29.9%;}
 186
 187 .yui-ge .yui-u,
 188 .yui-ge .yui-g,
 189 .yui-gf div.first {width:24%;}
 190
 191 .yui-ge div.first,
 192 .yui-gf .yui-g,
 193 .yui-gf .yui-u{width:74.2%;}
 194
 195 /* narrower width in nexted contexts */
 196 .yui-gb .yui-ge .yui-u,
 197 .yui-gb .yui-gf div.first {*width:24%;_width:20%;}
 198
 199 /* narrower width in nexted contexts */
 200 .yui-gb .yui-ge div.first,
 201 .yui-gb .yui-gf .yui-u{*width:73.5%;_width:65.5%;}
 202
 203 #bd:after,
 204 .yui-g:after,
 205 .yui-gb:after,
 206 .yui-gc:after,
 207 .yui-gd:after,
 208 .yui-ge:after,
 209 .yui-gf:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
 210 #bd,
 211 .yui-g,
 212 .yui-gb,
 213 .yui-gc,
 214 .yui-gd,
 215 .yui-ge,
 216 .yui-gf{zoom:1;}