grid_layout 

Send to Kindle
home » snippets » css » grid_layout


BluePrint Grids


YUI Grids

Core Concepts

Available Template Presets

Template Class Preset Description Example
.yui-t1 160 on left Example
.yui-t2 180 on left Example
.yui-t3 300 on left Example
.yui-t4 180 on right Example
.yui-t5 240 on right Example
.yui-t6 300 on right Example

Here's what the code looks like to choose a template preset:

<div id="doc" class="yui-t4"> <!-- change class to change preset -->
   <div id="hd"></div>
   <div id="bd">
      <div id="yui-main">
         <div class="yui-b"></div>
      </div>
      <div class="yui-b"></div>
   </div>
   <div id="ft"></div>
</div>

We offer the template presets we do because they accommodate standard IAB ad unit dimensions, and because they represent the vast majority of common page structures we use.