root / drupal7 / themes / stark / layout.css @ 76597ebf
| 1 | 85ad3d82 | Assos Assos | |
|---|---|---|---|
| 2 | /**
|
||
| 3 | * @file
|
||
| 4 | * Stark layout method
|
||
| 5 | *
|
||
| 6 | * To avoid obscuring CSS added to the page by Drupal or a contrib module, the
|
||
| 7 | * Stark theme itself has no styling, except just enough CSS to arrange the page
|
||
| 8 | * in a traditional "Header, sidebars, content, and footer" layout.
|
||
| 9 | *
|
||
| 10 | * This layout method works reasonably well, but shouldn't be used on a
|
||
| 11 | * production site because it can break. For example, if an over-large image
|
||
| 12 | * (one that is wider than 20% of the viewport) is in the left sidebar, the
|
||
| 13 | * image will overlap with the #content to the right. The exception to this
|
||
| 14 | * is IE6 which will just hide the navigation block completely in these
|
||
| 15 | * instances due to a positioning bug.
|
||
| 16 | */
|
||
| 17 | |||
| 18 | #content,
|
||
| 19 | #sidebar-first,
|
||
| 20 | #sidebar-second {
|
||
| 21 | float: left; |
||
| 22 | display: inline; |
||
| 23 | position: relative; |
||
| 24 | } |
||
| 25 | |||
| 26 | #content {
|
||
| 27 | width: 100%; |
||
| 28 | } |
||
| 29 | body.sidebar-first #content { |
||
| 30 | width: 80%; |
||
| 31 | left: 20%; /* LTR */ |
||
| 32 | } |
||
| 33 | body.sidebar-second #content { |
||
| 34 | width: 80%; |
||
| 35 | } |
||
| 36 | body.two-sidebars #content { |
||
| 37 | width: 60%; |
||
| 38 | left: 20%; |
||
| 39 | } |
||
| 40 | |||
| 41 | #sidebar-first {
|
||
| 42 | width: 20%; |
||
| 43 | left: -80%; /* LTR */ |
||
| 44 | } |
||
| 45 | |||
| 46 | body.two-sidebars #sidebar-first { |
||
| 47 | left: -60%; /* LTR */ |
||
| 48 | } |
||
| 49 | |||
| 50 | #sidebar-second {
|
||
| 51 | float: right; /* LTR */ |
||
| 52 | width: 20%; |
||
| 53 | } |
||
| 54 | |||
| 55 | .section {
|
||
| 56 | margin: 10px; |
||
| 57 | } |