webclient.js-ext.yui.build.grids.grids.css Maven / Gradle / Ivy

Go to download
/*
Copyright (c) 2010, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.com/yui/license.html
version: 2.8.2r1
*/
/**
 * YUI Grids
 * @module grids
 * @namespace yui-
 * @requires reset, fonts
 */

/**  
 * Note: Throughout this file, the *property (star-property) filter is used 
 * to give a value to IE that other browsers do not see. _property is only seen 
 * by IE7, so the combo of *prop and _prop can target between IE6 and IE7.
 * 
 * More information on these filters and related validation errors:
 * http://tech.groups.yahoo.com/group/ydn-javascript/message/40059
 */

/**
 * Section: General Rules
 */

body {
	text-align: center;
}

/**
 * Section: Page Width Rules (#doc, #doc2, #doc3, #doc4)
 */

#doc,#doc2,#doc3,#doc4,
.yui-t1,.yui-t2,.yui-t3,.yui-t4,.yui-t5,.yui-t6,.yui-t7 {
	margin: auto;
	text-align: left;
	width: 57.69em;
	*width: 56.25em;
}

/* 950 Centered (doc2) */
#doc2 {
	width: 73.076em;
	*width: 71.25em;
}

/* 100% (doc3) */
#doc3 {
/**
 * Left and Right margins are not a structural part of Grids. Without them 
 * Grids works fine, but content bleeds to the very edge of the document, which
 * often impairs readability and usability. They are provided because they 
 * prevent the content from "bleeding" into the browser's chrome. 
 */
	margin: auto 10px;
	width: auto;
}

/* 974 Centered (doc4) */
#doc4 {
	width: 74.923em;
	*width: 73.05em;
}

/**
 * Section: Preset Template Rules (.yui-t[1-6])
 */


.yui-b {
	/* to preserve source-order independence for Gecko */
	position: relative;
}

.yui-b {
	/* to preserve source-order independence for IE */
	_position: static;
}

#yui-main .yui-b {
	/* to preserve source-order independence for Gecko */
	position: static;
}

#yui-main,
.yui-g .yui-u .yui-g {
	width: 100%;
}

.yui-t1 #yui-main,
.yui-t2 #yui-main,
.yui-t3 #yui-main {
	float: right;
	/* IE: preserve layout at narrow widths */
	margin-left: -25em;
}

.yui-t4 #yui-main,
.yui-t5 #yui-main,
.yui-t6 #yui-main {
	float: left;
	/* IE: preserve layout at narrow widths */
	margin-right: -25em;
}

/** 
 * For Specific Template Presets
 */

.yui-t1 .yui-b {
	float: left;
	width: 12.30769em;
	*width: 12.00em;
}

.yui-t1 #yui-main .yui-b {
	margin-left: 13.30769em;
	*margin-left: 13.05em;
}

.yui-t2 .yui-b {
	float: left;
	width: 13.8461em;
	*width: 13.50em;
}

.yui-t2 #yui-main .yui-b {
	margin-left: 14.8461em;
	*margin-left: 14.55em;
}

.yui-t3 .yui-b {
	float: left;
	width: 23.0769em;
	*width: 22.50em;
}

.yui-t3 #yui-main .yui-b {
	margin-left: 24.0769em;
	*margin-left: 23.62em;
}

.yui-t4 .yui-b {
	float: right;
	width: 13.8456em;
	*width: 13.50em;
}

.yui-t4 #yui-main .yui-b {
	margin-right: 14.8456em;
	*margin-right: 14.55em;
}

.yui-t5 .yui-b {
	float: right;
	width: 18.4615em;
	*width: 18.00em;
}

.yui-t5 #yui-main .yui-b {
	margin-right: 19.4615em;
	*margin-right: 19.125em;
}

.yui-t6 .yui-b {
	float: right;
	width: 23.0769em;
	*width: 22.50em;
}

.yui-t6 #yui-main .yui-b {
	margin-right: 24.0769em;
	*margin-right: 23.62em;
}

.yui-t7 #yui-main .yui-b {
	display: block;
	margin: 0 0 1em 0;
}

#yui-main .yui-b {
	float: none;
	width: auto;
}

/**
 * Section: Grids and Nesting Grids
 */

/* Children generally take half the available space */
.yui-gb .yui-u,
.yui-g .yui-gb .yui-u,
.yui-gb .yui-g,
.yui-gb .yui-gb,
.yui-gb .yui-gc,
.yui-gb .yui-gd,
.yui-gb .yui-ge,
.yui-gb .yui-gf,
.yui-gc .yui-u, 
.yui-gc .yui-g,
.yui-gd .yui-u {
	float: left;
}

/* Float units (and sub grids) to the right */
.yui-g .yui-u,
.yui-g .yui-g,
.yui-g .yui-gb, 
.yui-g .yui-gc, 
.yui-g .yui-gd, 
.yui-g .yui-ge, 
.yui-g .yui-gf, 
.yui-gc .yui-u, 
.yui-gd .yui-g,
.yui-g .yui-gc .yui-u,
.yui-ge .yui-u, 
.yui-ge .yui-g, 
.yui-gf .yui-g,
.yui-gf .yui-u {
	float: right;
}

/*Float units (and sub grids) to the left */
.yui-g div.first, 
.yui-gb div.first,
.yui-gc div.first,
.yui-gd div.first, 
.yui-ge div.first, 
.yui-gf div.first,
.yui-g .yui-gc div.first,
.yui-g .yui-ge div.first,
.yui-gc div.first div.first {
	float: left;
}

.yui-g .yui-u,
.yui-g .yui-g,
.yui-g .yui-gb,
.yui-g .yui-gc,
.yui-g .yui-gd,
.yui-g .yui-ge,
.yui-g .yui-gf {
	width: 49.1%;
}

.yui-gb .yui-u,
.yui-g .yui-gb .yui-u,
.yui-gb .yui-g,
.yui-gb .yui-gb,
.yui-gb .yui-gc,
.yui-gb .yui-gd,
.yui-gb .yui-ge,
.yui-gb .yui-gf,
.yui-gc .yui-u, 
.yui-gc .yui-g,
.yui-gd .yui-u {
	width: 32%;
	margin-left: 1.99%;
}

/* Give IE some extra breathing room for 1/3-based rounding issues */
.yui-gb .yui-u {
	*margin-left: 1.9%;
	*width: 31.9%;
}

.yui-gc div.first, 
	.yui-gd .yui-u {
	width: 66%;
}

.yui-gd div.first {
	width: 32%;
}

.yui-ge div.first, 
	.yui-gf .yui-u {
	width: 74.2%;
}

.yui-ge .yui-u,
	.yui-gf div.first {
	width: 24%;
}

.yui-g .yui-gb div.first,
.yui-gb div.first, 
.yui-gc div.first, 
.yui-gd div.first {
	margin-left: 0;
}

/**
 * Section: Deep Nesting 
 */

.yui-g .yui-g .yui-u,
.yui-gb .yui-g .yui-u,
.yui-gc .yui-g .yui-u,
.yui-gd .yui-g .yui-u,
.yui-ge .yui-g .yui-u,
.yui-gf .yui-g .yui-u {
	width: 49%;
	*width: 48.1%;
	*margin-left: 0;
}

.yui-g .yui-g .yui-u {
	width: 48.1%;
}

/*YUILibrary bug #1927599 from 1.14 to 2.6.0*/
.yui-g .yui-gb div.first,
	.yui-gb .yui-gb div.first {
	*margin-right: 0;
	*width: 32%;
	_width: 31.7%;
}

.yui-g .yui-gc div.first, 
	.yui-gd .yui-g {
	width: 66%;
}

.yui-gb .yui-g div.first {
	*margin-right: 4%;
	_margin-right: 1.3%;
}

.yui-gb .yui-gc div.first, 
	.yui-gb .yui-gd div.first {
	*margin-right: 0;
}

.yui-gb .yui-gb .yui-u,
	.yui-gb .yui-gc .yui-u {
	*margin-left: 1.8%;
	_margin-left: 4%;
}

.yui-g .yui-gb .yui-u {
	_margin-left: 1.0%;
}

.yui-gb .yui-gd .yui-u {
	*width: 66%;
	_width: 61.2%;
}

.yui-gb .yui-gd div.first {
	*width: 31%;
	_width: 29.5%;
}

.yui-g .yui-gc .yui-u, 
	.yui-gb .yui-gc .yui-u {
	width: 32%;
	_float: right;
	margin-right: 0;
	_margin-left: 0;
}

.yui-gb .yui-gc div.first {
	width: 66%;
	*float: left;
	*margin-left: 0;
}

.yui-gb .yui-ge .yui-u, 
	.yui-gb .yui-gf .yui-u {
	margin: 0;
}

.yui-gb .yui-gb .yui-u {
	_margin-left: .7%;
}

.yui-gb .yui-g div.first, 
	.yui-gb .yui-gb div.first {
	*margin-left: 0;
}

.yui-gc .yui-g .yui-u,
	.yui-gd .yui-g .yui-u {
	*width: 48.1%;
	*margin-left: 0;
}

.yui-gb .yui-gd div.first {
	width: 32%;
}

.yui-g .yui-gd div.first {
	_width: 29.9%;
}

.yui-ge .yui-g {
	width: 24%;
}

.yui-gf .yui-g {
	width: 74.2%;
}

.yui-gb .yui-ge div.yui-u,
	.yui-gb .yui-gf div.yui-u {
	float: right;
}

.yui-gb .yui-ge div.first,
	.yui-gb .yui-gf div.first {
	float: left;
}

/* Width Accommodation for Nested Contexts */
.yui-gb .yui-ge .yui-u,
	.yui-gb .yui-gf div.first {
	*width: 24%;
	_width: 20%;
}

/* Width Accommodation for Nested Contexts */
.yui-gb .yui-ge div.first, 
	.yui-gb .yui-gf .yui-u {
	*width: 73.5%;
	_width: 65.5%;
}

/* Patch for GD within GE */
.yui-ge div.first .yui-gd .yui-u {
	width: 65%;
}

.yui-ge div.first .yui-gd div.first {
	width: 32%;
}

/* @group Clearing */
#hd:after,
#bd:after,
#ft:after,
.yui-g:after, 
.yui-gb:after, 
.yui-gc:after, 
.yui-gd:after, 
.yui-ge:after, 
.yui-gf:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

#hd,
#bd,
#ft,
.yui-g, 
.yui-gb, 
.yui-gc, 
.yui-gd, 
.yui-ge, 
.yui-gf {
	zoom: 1;
}