Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on Jun 17th, 2012  |  syntax: None  |  size: 0.54 KB  |  hits: 12  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. /**
  2.  * CSS3 Flexible Box Model
  3.  */
  4. html {
  5.   background: #f06;
  6.   background: linear-gradient(45deg, #f06, yellow);
  7.   height: 100%;
  8.   color: #fff;
  9.   font: 62.5% sans-serif;
  10.   margin: 0;
  11. }
  12. body {
  13.   height: 100%;
  14.   margin: 0;
  15. }
  16. .flex {
  17.   display: box;
  18.   box-orient: horizontal;
  19.   height: 100%;
  20. }
  21. .flex > article {
  22.   box-flex: 1;
  23.   margin: 8px;
  24.   padding: 8px;
  25.   text-align: center;
  26.   border: 1px solid #333;
  27.   border-radius: 8px;
  28.   background: #000;
  29.   background: linear-gradient(bottom, #000 0%, #2f2f2f 100%);
  30. }
  31. .flex > article:nth-child(2) {
  32.   box-flex: 3;
  33. }