gs960 0.0.1 → 0.0.2

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,357 @@
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,0 +1,357 @@
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-right: auto;
25
+ margin-left: 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: right;
46
+ margin-right: 10px;
47
+ margin-left: 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-right: 0;
69
+ }
70
+
71
+ .omega {
72
+ margin-left: 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-right: 80px;
131
+ }
132
+
133
+ .container_12 .prefix_2 {
134
+ padding-right: 160px;
135
+ }
136
+
137
+ .container_12 .prefix_3 {
138
+ padding-right: 240px;
139
+ }
140
+
141
+ .container_12 .prefix_4 {
142
+ padding-right: 320px;
143
+ }
144
+
145
+ .container_12 .prefix_5 {
146
+ padding-right: 400px;
147
+ }
148
+
149
+ .container_12 .prefix_6 {
150
+ padding-right: 480px;
151
+ }
152
+
153
+ .container_12 .prefix_7 {
154
+ padding-right: 560px;
155
+ }
156
+
157
+ .container_12 .prefix_8 {
158
+ padding-right: 640px;
159
+ }
160
+
161
+ .container_12 .prefix_9 {
162
+ padding-right: 720px;
163
+ }
164
+
165
+ .container_12 .prefix_10 {
166
+ padding-right: 800px;
167
+ }
168
+
169
+ .container_12 .prefix_11 {
170
+ padding-right: 880px;
171
+ }
172
+
173
+ /* `Suffix Extra Space >> 12 Columns
174
+ ----------------------------------------------------------------------------------------------------*/
175
+
176
+ .container_12 .suffix_1 {
177
+ padding-left: 80px;
178
+ }
179
+
180
+ .container_12 .suffix_2 {
181
+ padding-left: 160px;
182
+ }
183
+
184
+ .container_12 .suffix_3 {
185
+ padding-left: 240px;
186
+ }
187
+
188
+ .container_12 .suffix_4 {
189
+ padding-left: 320px;
190
+ }
191
+
192
+ .container_12 .suffix_5 {
193
+ padding-left: 400px;
194
+ }
195
+
196
+ .container_12 .suffix_6 {
197
+ padding-left: 480px;
198
+ }
199
+
200
+ .container_12 .suffix_7 {
201
+ padding-left: 560px;
202
+ }
203
+
204
+ .container_12 .suffix_8 {
205
+ padding-left: 640px;
206
+ }
207
+
208
+ .container_12 .suffix_9 {
209
+ padding-left: 720px;
210
+ }
211
+
212
+ .container_12 .suffix_10 {
213
+ padding-left: 800px;
214
+ }
215
+
216
+ .container_12 .suffix_11 {
217
+ padding-left: 880px;
218
+ }
219
+
220
+ /* `Push Space >> 12 Columns
221
+ ----------------------------------------------------------------------------------------------------*/
222
+
223
+ .container_12 .push_1 {
224
+ right: 80px;
225
+ }
226
+
227
+ .container_12 .push_2 {
228
+ right: 160px;
229
+ }
230
+
231
+ .container_12 .push_3 {
232
+ right: 240px;
233
+ }
234
+
235
+ .container_12 .push_4 {
236
+ right: 320px;
237
+ }
238
+
239
+ .container_12 .push_5 {
240
+ right: 400px;
241
+ }
242
+
243
+ .container_12 .push_6 {
244
+ right: 480px;
245
+ }
246
+
247
+ .container_12 .push_7 {
248
+ right: 560px;
249
+ }
250
+
251
+ .container_12 .push_8 {
252
+ right: 640px;
253
+ }
254
+
255
+ .container_12 .push_9 {
256
+ right: 720px;
257
+ }
258
+
259
+ .container_12 .push_10 {
260
+ right: 800px;
261
+ }
262
+
263
+ .container_12 .push_11 {
264
+ right: 880px;
265
+ }
266
+
267
+ /* `Pull Space >> 12 Columns
268
+ ----------------------------------------------------------------------------------------------------*/
269
+
270
+ .container_12 .pull_1 {
271
+ right: -80px;
272
+ }
273
+
274
+ .container_12 .pull_2 {
275
+ right: -160px;
276
+ }
277
+
278
+ .container_12 .pull_3 {
279
+ right: -240px;
280
+ }
281
+
282
+ .container_12 .pull_4 {
283
+ right: -320px;
284
+ }
285
+
286
+ .container_12 .pull_5 {
287
+ right: -400px;
288
+ }
289
+
290
+ .container_12 .pull_6 {
291
+ right: -480px;
292
+ }
293
+
294
+ .container_12 .pull_7 {
295
+ right: -560px;
296
+ }
297
+
298
+ .container_12 .pull_8 {
299
+ right: -640px;
300
+ }
301
+
302
+ .container_12 .pull_9 {
303
+ right: -720px;
304
+ }
305
+
306
+ .container_12 .pull_10 {
307
+ right: -800px;
308
+ }
309
+
310
+ .container_12 .pull_11 {
311
+ right: -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
+ }