1
+ /*
2
+ 960 Grid System ~ Core CSS.
3
+ Learn more ~ http://960.gs/
4
+
5
+ Licensed under GPL and MIT.
6
+ */
7
+
8
+ /*
9
+ Forces backgrounds to span full width,
10
+ even if there is horizontal scrolling.
11
+ Increase this if your layout is wider.
12
+
13
+ Note: IE6 works fine without this fix.
14
+ */
15
+
16
+ body {
17
+ min-width : 960px ;
18
+ }
19
+
20
+ /* `Container
21
+ ----------------------------------------------------------------------------------------------------*/
22
+
23
+ .container_12 {
24
+ margin-left : auto;
25
+ margin-right : auto;
26
+ width : 960px ;
27
+ }
28
+
29
+ /* `Grid >> Global
30
+ ----------------------------------------------------------------------------------------------------*/
31
+
32
+ .grid_1 ,
33
+ .grid_2 ,
34
+ .grid_3 ,
35
+ .grid_4 ,
36
+ .grid_5 ,
37
+ .grid_6 ,
38
+ .grid_7 ,
39
+ .grid_8 ,
40
+ .grid_9 ,
41
+ .grid_10 ,
42
+ .grid_11 ,
43
+ .grid_12 {
44
+ display : inline;
45
+ float : left;
46
+ margin-left : 10px ;
47
+ margin-right : 10px ;
48
+ }
49
+
50
+ .push_1 , .pull_1 ,
51
+ .push_2 , .pull_2 ,
52
+ .push_3 , .pull_3 ,
53
+ .push_4 , .pull_4 ,
54
+ .push_5 , .pull_5 ,
55
+ .push_6 , .pull_6 ,
56
+ .push_7 , .pull_7 ,
57
+ .push_8 , .pull_8 ,
58
+ .push_9 , .pull_9 ,
59
+ .push_10 , .pull_10 ,
60
+ .push_11 , .pull_11 {
61
+ position : relative;
62
+ }
63
+
64
+ /* `Grid >> Children (Alpha ~ First, Omega ~ Last)
65
+ ----------------------------------------------------------------------------------------------------*/
66
+
67
+ .alpha {
68
+ margin-left : 0 ;
69
+ }
70
+
71
+ .omega {
72
+ margin-right : 0 ;
73
+ }
74
+
75
+ /* `Grid >> 12 Columns
76
+ ----------------------------------------------------------------------------------------------------*/
77
+
78
+ .container_12 .grid_1 {
79
+ width : 60px ;
80
+ }
81
+
82
+ .container_12 .grid_2 {
83
+ width : 140px ;
84
+ }
85
+
86
+ .container_12 .grid_3 {
87
+ width : 220px ;
88
+ }
89
+
90
+ .container_12 .grid_4 {
91
+ width : 300px ;
92
+ }
93
+
94
+ .container_12 .grid_5 {
95
+ width : 380px ;
96
+ }
97
+
98
+ .container_12 .grid_6 {
99
+ width : 460px ;
100
+ }
101
+
102
+ .container_12 .grid_7 {
103
+ width : 540px ;
104
+ }
105
+
106
+ .container_12 .grid_8 {
107
+ width : 620px ;
108
+ }
109
+
110
+ .container_12 .grid_9 {
111
+ width : 700px ;
112
+ }
113
+
114
+ .container_12 .grid_10 {
115
+ width : 780px ;
116
+ }
117
+
118
+ .container_12 .grid_11 {
119
+ width : 860px ;
120
+ }
121
+
122
+ .container_12 .grid_12 {
123
+ width : 940px ;
124
+ }
125
+
126
+ /* `Prefix Extra Space >> 12 Columns
127
+ ----------------------------------------------------------------------------------------------------*/
128
+
129
+ .container_12 .prefix_1 {
130
+ padding-left : 80px ;
131
+ }
132
+
133
+ .container_12 .prefix_2 {
134
+ padding-left : 160px ;
135
+ }
136
+
137
+ .container_12 .prefix_3 {
138
+ padding-left : 240px ;
139
+ }
140
+
141
+ .container_12 .prefix_4 {
142
+ padding-left : 320px ;
143
+ }
144
+
145
+ .container_12 .prefix_5 {
146
+ padding-left : 400px ;
147
+ }
148
+
149
+ .container_12 .prefix_6 {
150
+ padding-left : 480px ;
151
+ }
152
+
153
+ .container_12 .prefix_7 {
154
+ padding-left : 560px ;
155
+ }
156
+
157
+ .container_12 .prefix_8 {
158
+ padding-left : 640px ;
159
+ }
160
+
161
+ .container_12 .prefix_9 {
162
+ padding-left : 720px ;
163
+ }
164
+
165
+ .container_12 .prefix_10 {
166
+ padding-left : 800px ;
167
+ }
168
+
169
+ .container_12 .prefix_11 {
170
+ padding-left : 880px ;
171
+ }
172
+
173
+ /* `Suffix Extra Space >> 12 Columns
174
+ ----------------------------------------------------------------------------------------------------*/
175
+
176
+ .container_12 .suffix_1 {
177
+ padding-right : 80px ;
178
+ }
179
+
180
+ .container_12 .suffix_2 {
181
+ padding-right : 160px ;
182
+ }
183
+
184
+ .container_12 .suffix_3 {
185
+ padding-right : 240px ;
186
+ }
187
+
188
+ .container_12 .suffix_4 {
189
+ padding-right : 320px ;
190
+ }
191
+
192
+ .container_12 .suffix_5 {
193
+ padding-right : 400px ;
194
+ }
195
+
196
+ .container_12 .suffix_6 {
197
+ padding-right : 480px ;
198
+ }
199
+
200
+ .container_12 .suffix_7 {
201
+ padding-right : 560px ;
202
+ }
203
+
204
+ .container_12 .suffix_8 {
205
+ padding-right : 640px ;
206
+ }
207
+
208
+ .container_12 .suffix_9 {
209
+ padding-right : 720px ;
210
+ }
211
+
212
+ .container_12 .suffix_10 {
213
+ padding-right : 800px ;
214
+ }
215
+
216
+ .container_12 .suffix_11 {
217
+ padding-right : 880px ;
218
+ }
219
+
220
+ /* `Push Space >> 12 Columns
221
+ ----------------------------------------------------------------------------------------------------*/
222
+
223
+ .container_12 .push_1 {
224
+ left : 80px ;
225
+ }
226
+
227
+ .container_12 .push_2 {
228
+ left : 160px ;
229
+ }
230
+
231
+ .container_12 .push_3 {
232
+ left : 240px ;
233
+ }
234
+
235
+ .container_12 .push_4 {
236
+ left : 320px ;
237
+ }
238
+
239
+ .container_12 .push_5 {
240
+ left : 400px ;
241
+ }
242
+
243
+ .container_12 .push_6 {
244
+ left : 480px ;
245
+ }
246
+
247
+ .container_12 .push_7 {
248
+ left : 560px ;
249
+ }
250
+
251
+ .container_12 .push_8 {
252
+ left : 640px ;
253
+ }
254
+
255
+ .container_12 .push_9 {
256
+ left : 720px ;
257
+ }
258
+
259
+ .container_12 .push_10 {
260
+ left : 800px ;
261
+ }
262
+
263
+ .container_12 .push_11 {
264
+ left : 880px ;
265
+ }
266
+
267
+ /* `Pull Space >> 12 Columns
268
+ ----------------------------------------------------------------------------------------------------*/
269
+
270
+ .container_12 .pull_1 {
271
+ left : -80px ;
272
+ }
273
+
274
+ .container_12 .pull_2 {
275
+ left : -160px ;
276
+ }
277
+
278
+ .container_12 .pull_3 {
279
+ left : -240px ;
280
+ }
281
+
282
+ .container_12 .pull_4 {
283
+ left : -320px ;
284
+ }
285
+
286
+ .container_12 .pull_5 {
287
+ left : -400px ;
288
+ }
289
+
290
+ .container_12 .pull_6 {
291
+ left : -480px ;
292
+ }
293
+
294
+ .container_12 .pull_7 {
295
+ left : -560px ;
296
+ }
297
+
298
+ .container_12 .pull_8 {
299
+ left : -640px ;
300
+ }
301
+
302
+ .container_12 .pull_9 {
303
+ left : -720px ;
304
+ }
305
+
306
+ .container_12 .pull_10 {
307
+ left : -800px ;
308
+ }
309
+
310
+ .container_12 .pull_11 {
311
+ left : -880px ;
312
+ }
313
+
314
+ /* `Clear Floated Elements
315
+ ----------------------------------------------------------------------------------------------------*/
316
+
317
+ /* http://sonspring.com/journal/clearing-floats */
318
+
319
+ .clear {
320
+ clear : both;
321
+ display : block;
322
+ overflow : hidden;
323
+ visibility : hidden;
324
+ width : 0 ;
325
+ height : 0 ;
326
+ }
327
+
328
+ /* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */
329
+
330
+ .clearfix : before ,
331
+ .clearfix : after ,
332
+ .container_12 : before ,
333
+ .container_12 : after {
334
+ content : '.' ;
335
+ display : block;
336
+ overflow : hidden;
337
+ visibility : hidden;
338
+ font-size : 0 ;
339
+ line-height : 0 ;
340
+ width : 0 ;
341
+ height : 0 ;
342
+ }
343
+
344
+ .clearfix : after ,
345
+ .container_12 : after {
346
+ clear : both;
347
+ }
348
+
349
+ /*
350
+ The following zoom:1 rule is specifically for IE6 + IE7.
351
+ Move to separate stylesheet if invalid CSS is a problem.
352
+ */
353
+
354
+ .clearfix ,
355
+ .container_12 {
356
+ zoom : 1 ;
357
+ }
0 commit comments