58 行
1.2 KiB
CSS
58 行
1.2 KiB
CSS
|
|
/**
|
|
* @file
|
|
* Stark layout method
|
|
*
|
|
* To avoid obscuring CSS added to the page by Drupal or a contrib module, the
|
|
* Stark theme itself has no styling, except just enough CSS to arrange the page
|
|
* in a traditional "Header, sidebars, content, and footer" layout.
|
|
*
|
|
* This layout method works reasonably well, but shouldn't be used on a
|
|
* production site because it can break. For example, if an over-large image
|
|
* (one that is wider than 20% of the viewport) is in the left sidebar, the
|
|
* image will overlap with the #content to the right. The exception to this
|
|
* is IE6 which will just hide the navigation block completely in these
|
|
* instances due to a positioning bug.
|
|
*/
|
|
|
|
#content,
|
|
#sidebar-first,
|
|
#sidebar-second {
|
|
float: left;
|
|
display: inline;
|
|
position: relative;
|
|
}
|
|
|
|
#content {
|
|
width: 100%;
|
|
}
|
|
body.sidebar-first #content {
|
|
width: 80%;
|
|
left: 20%; /* LTR */
|
|
}
|
|
body.sidebar-second #content {
|
|
width: 80%;
|
|
}
|
|
body.two-sidebars #content {
|
|
width: 60%;
|
|
left: 20%;
|
|
}
|
|
|
|
#sidebar-first {
|
|
width: 20%;
|
|
left: -80%; /* LTR */
|
|
}
|
|
|
|
body.two-sidebars #sidebar-first {
|
|
left: -60%; /* LTR */
|
|
}
|
|
|
|
#sidebar-second {
|
|
float: right; /* LTR */
|
|
width: 20%;
|
|
}
|
|
|
|
.section {
|
|
margin: 10px;
|
|
}
|