173 lines
3.7 KiB
CSS
173 lines
3.7 KiB
CSS
/*
|
|
* Copyright 2007 The Closure Library Authors. All Rights Reserved.
|
|
*
|
|
* Use of this source code is governed by the Apache License, Version 2.0.
|
|
* See the COPYING file for details.
|
|
*/
|
|
|
|
/**
|
|
* CSS Inlay
|
|
* Fixed templates
|
|
* @author ddiaz@google.com (Dustin Diaz)
|
|
* @author elsigh@google.com (Lindsey Simon)
|
|
* @fileoverview
|
|
* The nature of these templates is to have one unit be a fixed width
|
|
* and the supplementary unit to take up the rest of the width
|
|
* of its parents' container.
|
|
*
|
|
* Sample Usage:
|
|
<div class="g-section g-tpl-180">
|
|
<div class="g-unit g-first">
|
|
<p>
|
|
Lorem Ipsum...
|
|
</p>
|
|
</div>
|
|
<div class="g-unit">
|
|
<p>
|
|
Lorem Ipsum...
|
|
</p>
|
|
</div>
|
|
</div>
|
|
*/
|
|
|
|
/* Document container designed for 1024x768 */
|
|
/* TODO(ux-webdev): convert this to a straight px value - em assumes reset. */
|
|
.g-doc-1024 {
|
|
width: 73.074em;
|
|
min-width: 950px; /* min-width doesn't work in IE6 */
|
|
margin: 0 auto;
|
|
text-align: left;
|
|
}
|
|
/* IE 6 */
|
|
* html .g-doc-1024 {
|
|
width: 71.313em;
|
|
}
|
|
/* IE 7 */
|
|
*+html .g-doc-1024 {
|
|
width: 71.313em;
|
|
}
|
|
|
|
/* Document container designed for 800x600 */
|
|
/* TODO(ux-webdev): convert this to a straight px value - em assumes reset. */
|
|
.g-doc-800 {
|
|
width: 57.69em;
|
|
min-width: 750px; /* min-width doesn't work in IE6 */
|
|
margin: 0 auto;
|
|
text-align: left;
|
|
}
|
|
/* IE 6 */
|
|
* html .g-doc-800 {
|
|
width: 56.3em;
|
|
}
|
|
/* IE 7 */
|
|
*+html .g-doc-800 {
|
|
width: 56.3em;
|
|
}
|
|
|
|
/* 160px */
|
|
.g-tpl-160 .g-unit,
|
|
.g-unit .g-tpl-160 .g-unit,
|
|
.g-unit .g-unit .g-tpl-160 .g-unit,
|
|
.g-unit .g-unit .g-unit .g-tpl-160 .g-unit {
|
|
margin: 0 0 0 160px;
|
|
width: auto;
|
|
float: none;
|
|
}
|
|
.g-unit .g-unit .g-unit .g-tpl-160 .g-first,
|
|
.g-unit .g-unit .g-tpl-160 .g-first,
|
|
.g-unit .g-tpl-160 .g-first,
|
|
.g-tpl-160 .g-first {
|
|
margin: 0;
|
|
width: 160px;
|
|
float: left;
|
|
}
|
|
|
|
/* 160px alt */
|
|
.g-tpl-160-alt .g-unit,
|
|
.g-unit .g-tpl-160-alt .g-unit,
|
|
.g-unit .g-unit .g-tpl-160-alt .g-unit,
|
|
.g-unit .g-unit .g-unit .g-tpl-160-alt .g-unit {
|
|
margin: 0 160px 0 0;
|
|
width: auto;
|
|
float: none;
|
|
}
|
|
.g-unit .g-unit .g-unit .g-tpl-160-alt .g-first,
|
|
.g-unit .g-unit .g-tpl-160-alt .g-first,
|
|
.g-unit .g-tpl-160-alt .g-first,
|
|
.g-tpl-160-alt .g-first {
|
|
margin: 0;
|
|
width: 160px;
|
|
float: right;
|
|
}
|
|
|
|
/* 180px */
|
|
.g-tpl-180 .g-unit,
|
|
.g-unit .g-tpl-180 .g-unit,
|
|
.g-unit .g-unit .g-tpl-180 .g-unit,
|
|
.g-unit .g-unit .g-unit .g-tpl-180 .g-unit {
|
|
margin: 0 0 0 180px;
|
|
width: auto;
|
|
float: none;
|
|
}
|
|
.g-unit .g-unit .g-unit .g-tpl-180 .g-first,
|
|
.g-unit .g-unit .g-tpl-180 .g-first,
|
|
.g-unit .g-tpl-180 .g-first,
|
|
.g-tpl-180 .g-first {
|
|
margin: 0;
|
|
width: 180px;
|
|
float: left;
|
|
}
|
|
|
|
/* 180px alt */
|
|
.g-tpl-180-alt .g-unit,
|
|
.g-unit .g-tpl-180-alt .g-unit,
|
|
.g-unit .g-unit .g-tpl-180-alt .g-unit,
|
|
.g-unit .g-unit .g-unit .g-tpl-180-alt .g-unit {
|
|
margin: 0 180px 0 0;
|
|
width: auto;
|
|
float: none;
|
|
}
|
|
.g-unit .g-unit .g-unit .g-tpl-180-alt .g-first,
|
|
.g-unit .g-unit .g-tpl-180-alt .g-first,
|
|
.g-unit .g-tpl-180-alt .g-first,
|
|
.g-tpl-180-alt .g-first {
|
|
margin: 0;
|
|
width: 180px;
|
|
float: right;
|
|
}
|
|
|
|
/* 300px */
|
|
.g-tpl-300 .g-unit,
|
|
.g-unit .g-tpl-300 .g-unit,
|
|
.g-unit .g-unit .g-tpl-300 .g-unit,
|
|
.g-unit .g-unit .g-unit .g-tpl-300 .g-unit {
|
|
margin: 0 0 0 300px;
|
|
width: auto;
|
|
float: none;
|
|
}
|
|
.g-unit .g-unit .g-unit .g-tpl-300 .g-first,
|
|
.g-unit .g-unit .g-tpl-300 .g-first,
|
|
.g-unit .g-tpl-300 .g-first,
|
|
.g-tpl-300 .g-first {
|
|
margin: 0;
|
|
width: 300px;
|
|
float: left;
|
|
}
|
|
|
|
/* 300px alt */
|
|
.g-tpl-300-alt .g-unit,
|
|
.g-unit .g-tpl-300-alt .g-unit,
|
|
.g-unit .g-unit .g-tpl-300-alt .g-unit,
|
|
.g-unit .g-unit .g-unit .g-tpl-300-alt .g-unit {
|
|
margin: 0 300px 0 0;
|
|
width: auto;
|
|
float: none;
|
|
}
|
|
.g-unit .g-unit .g-unit .g-tpl-300-alt .g-first,
|
|
.g-unit .g-unit .g-tpl-300-alt .g-first,
|
|
.g-unit .g-tpl-300-alt .g-first,
|
|
.g-tpl-300-alt .g-first {
|
|
margin: 0;
|
|
width: 300px;
|
|
float: right;
|
|
} |