Guest User

Untitled

a guest
Apr 7th, 2009
643
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 6.45 KB | None | 0 0
  1. /*
  2.     960 Grid System ~ Core CSS.
  3.     Learn more ~ http://960.gs/
  4.  
  5.     Licensed under GPL and MIT.
  6. */
  7.  
  8. /* `Containers
  9. ----------------------------------------------------------------------------------------------------*/
  10.  
  11. .container_12,
  12. .container_16 {
  13.     margin-left: auto;
  14.     margin-right: auto;
  15.     width: 960px;
  16. }
  17.  
  18. /* `Grid >> Global
  19. ----------------------------------------------------------------------------------------------------*/
  20.  
  21. .grid_1,
  22. .grid_2,
  23. .grid_3,
  24. .grid_4,
  25. .grid_5,
  26. .grid_6,
  27. .grid_7,
  28. .grid_8,
  29. .grid_9,
  30. .grid_10,
  31. .grid_11,
  32. .grid_12,
  33. .grid_13,
  34. .grid_14,
  35. .grid_15,
  36. .grid_16 {
  37.     display: inline;
  38.     float: left;
  39.     margin-left: 10px;
  40.     margin-right: 10px;
  41. }
  42.  
  43. .container_12 .grid_3,
  44. .container_16 .grid_4 {
  45.     width: 220px;
  46. }
  47.  
  48. .container_12 .grid_6,
  49. .container_16 .grid_8 {
  50.     width: 460px;
  51. }
  52.  
  53. .container_12 .grid_9,
  54. .container_16 .grid_12 {
  55.     width: 700px;
  56. }
  57.  
  58. .container_12 .grid_12,
  59. .container_16 .grid_16 {
  60.     width: 940px;
  61. }
  62.  
  63. /* `Grid >> Children (Alpha ~ First, Omega ~ Last)
  64. ----------------------------------------------------------------------------------------------------*/
  65.  
  66. .alpha {
  67.     margin-left: 0;
  68. }
  69.  
  70. .omega {
  71.     margin-right: 0;
  72. }
  73.  
  74. /* `Grid >> 12 Columns
  75. ----------------------------------------------------------------------------------------------------*/
  76.  
  77. .container_12 .grid_1 {
  78.     width: 60px;
  79. }
  80.  
  81. .container_12 .grid_2 {
  82.     width: 140px;
  83. }
  84.  
  85. .container_12 .grid_4 {
  86.     width: 300px;
  87. }
  88.  
  89. .container_12 .grid_5 {
  90.     width: 380px;
  91. }
  92.  
  93. .container_12 .grid_7 {
  94.     width: 540px;
  95. }
  96.  
  97. .container_12 .grid_8 {
  98.     width: 620px;
  99. }
  100.  
  101. .container_12 .grid_10 {
  102.     width: 780px;
  103. }
  104.  
  105. .container_12 .grid_11 {
  106.     width: 860px;
  107. }
  108.  
  109. /* `Grid >> 16 Columns
  110. ----------------------------------------------------------------------------------------------------*/
  111.  
  112. .container_16 .grid_1 {
  113.     width: 40px;
  114. }
  115.  
  116. .container_16 .grid_2 {
  117.     width: 100px;
  118. }
  119.  
  120. .container_16 .grid_3 {
  121.     width: 160px;
  122. }
  123.  
  124. .container_16 .grid_5 {
  125.     width: 280px;
  126. }
  127.  
  128. .container_16 .grid_6 {
  129.     width: 340px;
  130. }
  131.  
  132. .container_16 .grid_7 {
  133.     width: 400px;
  134. }
  135.  
  136. .container_16 .grid_9 {
  137.     width: 520px;
  138. }
  139.  
  140. .container_16 .grid_10 {
  141.     width: 580px;
  142. }
  143.  
  144. .container_16 .grid_11 {
  145.     width: 640px;
  146. }
  147.  
  148. .container_16 .grid_13 {
  149.     width: 760px;
  150. }
  151.  
  152. .container_16 .grid_14 {
  153.     width: 820px;
  154. }
  155.  
  156. .container_16 .grid_15 {
  157.     width: 880px;
  158. }
  159.  
  160. /* `Prefix Extra Space >> Global
  161. ----------------------------------------------------------------------------------------------------*/
  162.  
  163. .container_12 .prefix_3,
  164. .container_16 .prefix_4 {
  165.     padding-left: 240px;
  166. }
  167.  
  168. .container_12 .prefix_6,
  169. .container_16 .prefix_8 {
  170.     padding-left: 480px;
  171. }
  172.  
  173. .container_12 .prefix_9,
  174. .container_16 .prefix_12 {
  175.     padding-left: 720px;
  176. }
  177.  
  178. /* `Prefix Extra Space >> 12 Columns
  179. ----------------------------------------------------------------------------------------------------*/
  180.  
  181. .container_12 .prefix_1 {
  182.     padding-left: 80px;
  183. }
  184.  
  185. .container_12 .prefix_2 {
  186.     padding-left: 160px;
  187. }
  188.  
  189. .container_12 .prefix_4 {
  190.     padding-left: 320px;
  191. }
  192.  
  193. .container_12 .prefix_5 {
  194.     padding-left: 400px;
  195. }
  196.  
  197. .container_12 .prefix_7 {
  198.     padding-left: 560px;
  199. }
  200.  
  201. .container_12 .prefix_8 {
  202.     padding-left: 640px;
  203. }
  204.  
  205. .container_12 .prefix_10 {
  206.     padding-left: 800px;
  207. }
  208.  
  209. .container_12 .prefix_11 {
  210.     padding-left: 880px;
  211. }
  212.  
  213. /* `Prefix Extra Space >> 16 Columns
  214. ----------------------------------------------------------------------------------------------------*/
  215.  
  216. .container_16 .prefix_1 {
  217.     padding-left: 60px;
  218. }
  219.  
  220. .container_16 .prefix_2 {
  221.     padding-left: 120px;
  222. }
  223.  
  224. .container_16 .prefix_3 {
  225.     padding-left: 180px;
  226. }
  227.  
  228. .container_16 .prefix_5 {
  229.     padding-left: 300px;
  230. }
  231.  
  232. .container_16 .prefix_6 {
  233.     padding-left: 360px;
  234. }
  235.  
  236. .container_16 .prefix_7 {
  237.     padding-left: 420px;
  238. }
  239.  
  240. .container_16 .prefix_9 {
  241.     padding-left: 540px;
  242. }
  243.  
  244. .container_16 .prefix_10 {
  245.     padding-left: 600px;
  246. }
  247.  
  248. .container_16 .prefix_11 {
  249.     padding-left: 660px;
  250. }
  251.  
  252. .container_16 .prefix_13 {
  253.     padding-left: 780px;
  254. }
  255.  
  256. .container_16 .prefix_14 {
  257.     padding-left: 840px;
  258. }
  259.  
  260. .container_16 .prefix_15 {
  261.     padding-left: 900px;
  262. }
  263.  
  264. /* `Suffix Extra Space >> Global
  265. ----------------------------------------------------------------------------------------------------*/
  266.  
  267. .container_12 .suffix_3,
  268. .container_16 .suffix_4 {
  269.     padding-right: 240px;
  270. }
  271.  
  272. .container_12 .suffix_6,
  273. .container_16 .suffix_8 {
  274.     padding-right: 480px;
  275. }
  276.  
  277. .container_12 .suffix_9,
  278. .container_16 .suffix_12 {
  279.     padding-right: 720px;
  280. }
  281.  
  282. /* `Suffix Extra Space >> 12 Columns
  283. ----------------------------------------------------------------------------------------------------*/
  284.  
  285. .container_12 .suffix_1 {
  286.     padding-right: 80px;
  287. }
  288.  
  289. .container_12 .suffix_2 {
  290.     padding-right: 160px;
  291. }
  292.  
  293. .container_12 .suffix_4 {
  294.     padding-right: 320px;
  295. }
  296.  
  297. .container_12 .suffix_5 {
  298.     padding-right: 400px;
  299. }
  300.  
  301. .container_12 .suffix_7 {
  302.     padding-right: 560px;
  303. }
  304.  
  305. .container_12 .suffix_8 {
  306.     padding-right: 640px;
  307. }
  308.  
  309. .container_12 .suffix_10 {
  310.     padding-right: 800px;
  311. }
  312.  
  313. .container_12 .suffix_11 {
  314.     padding-right: 880px;
  315. }
  316.  
  317. /* `Suffix Extra Space >> 16 Columns
  318. ----------------------------------------------------------------------------------------------------*/
  319.  
  320. .container_16 .suffix_1 {
  321.     padding-right: 60px;
  322. }
  323.  
  324. .container_16 .suffix_2 {
  325.     padding-right: 120px;
  326. }
  327.  
  328. .container_16 .suffix_3 {
  329.     padding-right: 180px;
  330. }
  331.  
  332. .container_16 .suffix_5 {
  333.     padding-right: 300px;
  334. }
  335.  
  336. .container_16 .suffix_6 {
  337.     padding-right: 360px;
  338. }
  339.  
  340. .container_16 .suffix_7 {
  341.     padding-right: 420px;
  342. }
  343.  
  344. .container_16 .suffix_9 {
  345.     padding-right: 540px;
  346. }
  347.  
  348. .container_16 .suffix_10 {
  349.     padding-right: 600px;
  350. }
  351.  
  352. .container_16 .suffix_11 {
  353.     padding-right: 660px;
  354. }
  355.  
  356. .container_16 .suffix_13 {
  357.     padding-right: 780px;
  358. }
  359.  
  360. .container_16 .suffix_14 {
  361.     padding-right: 840px;
  362. }
  363.  
  364. .container_16 .suffix_15 {
  365.     padding-right: 900px;
  366. }
  367.  
  368. /* `Clear Floated Elements
  369. ----------------------------------------------------------------------------------------------------*/
  370.  
  371. /* http://sonspring.com/journal/clearing-floats */
  372.  
  373. .clear {
  374.     clear: both;
  375.     display: block;
  376.     overflow: hidden;
  377.     visibility: hidden;
  378.     width: 0;
  379.     height: 0;
  380. }
  381.  
  382. /* http://www.positioniseverything.net/easyclearing.html */
  383.  
  384. .clearfix:after {
  385.     clear: both;
  386.     content: '.';
  387.     display: block;
  388.     font-size: 0;
  389.     line-height: 0;
  390.     visibility: hidden;
  391.     width: 0;
  392.     height: 0;
  393. }
  394.  
  395. .clearfix {
  396.     display: inline-block;
  397. }
  398.  
  399. * html .clearfix {
  400.     height: 1%;
  401. }
  402.  
  403. .clearfix {
  404.     display: block;
  405. }
Advertisement
Add Comment
Please, Sign In to add comment