<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>YUI 3.x: CSS Grids Fixed Example</title>
<link rel="stylesheet" href="../../build/cssreset/cssreset.css" type="text/css">
<link rel="stylesheet" href="../../build/cssfonts/cssfonts.css" type="text/css">
<link rel="stylesheet" href="../../build/cssgrids/cssgrids.css" type="text/css">
<script src="../../build/yui/yui-min.js"></script>
<style>
/* everything below is custom styling to demonstrate how to create a page layout using yui grid units */
#doc {
margin:auto; /* center in viewport */
width: 970px; /* fix page width */
}
/* arbitrary content styling */
#hd, .yui3-g .content, #ft {
border: 5px solid #ccc;
height: 400px;
margin-right: 10px; /* gutter between columns */
}
#hd, #ft {
height: 40px;
}
</style>
</head>
<body id="doc">
<div id="hd">
<h1>Fixed Layout Template</h1>
</div>
<div class="yui3-g">
<div class="yui3-u-1-5">
<div class="content"></div>
</div>
<div class="yui3-u-2-5">
<div class="content"></div>
</div>
<div class="yui3-u-2-5">
<div class="content"></div>
</div>
</div>
<div id="ft"></div>
</body>
</html>
<script>
YUI.Env.Tests = {
examples: [],
project: '../assets',
assets: '../assets/cssgrids',
name: 'cssgrids-fixed',
title: 'Fixed Width Page Layout',
newWindow: '',
auto: false
};
YUI.Env.Tests.examples.push('cssgrids-units');
YUI.Env.Tests.examples.push('cssgrids-fixed');
YUI.Env.Tests.examples.push('cssgrids-fluid');
YUI.Env.Tests.examples.push('cssgrids-align');
YUI.Env.Tests.examples.push('cssgrids-magazine');
YUI.Env.Tests.examples.push('menunav-leftnav');
YUI.Env.Tests.examples.push('node-menunav-2');
YUI.Env.Tests.examples.push('node-menunav-3');
YUI.Env.Tests.examples.push('node-menunav-4');
YUI.Env.Tests.examples.push('node-menunav-5');
YUI.Env.Tests.examples.push('node-menunav-6');
YUI.Env.Tests.examples.push('node-menunav-7');
</script>
<script src="../assets/yui/test-runner.js"></script>