DEFLIGRA STACKS

Version 2.03

Made for
Stacks 2.

V/2.02
add a feature to add a tillable images to the board.

v/2.03
see your imported images in both preview and edit.

LinkStyler is now part of GridBoard - making it easy to create cool css and css3 buttons (no manual for this one at the moment though).

GridBoard

GridBoard is a stylish set of stacks allowing you to organize content into groups of columns - into a GridBoard. You get to choose the exact width of each column just like the FlexGrid (but with equal height) - making it easy to grid your 'board' and create a stylish web layout.

You work horizontal with your content - not vertical. Makes it easier to layout your content.

DeFliGra GridBoard = 6 stacks. From 1 to 6 columns with equal height… made easy!

Questions? Shoot me… an e-mail.

In other words...
Create kind of a board with equal columns (1 to 6 columns). Choose the individual width and colors of each columns.

What it's not...
The GridBoard is not a table maker. There are stacks better suited for that purpose. It's more of a stylish column divided frame maker for presenting your content with style.

Known issues
Some themes use a CSS reset like Meyer's CSS reset. This might conflict with GridBoard and FlexGrid.

Solution
You can try removing the CSS Edit from the theme - or better make the code a comment .

Column width

Compared to the FlexGrid stacks the GridBoard stacks has a huge arsenal of styling weapons. Individual colors of each column and equal column height.

GridBoard

Align Y and Align X aligns your columns. 1 to 6 columns depending one the GridBoard Stack you choose.

Column Space adds space between and around the columns (or zero space).

Board Padding adds padding around the board (in the example above the gray rounded box).

Column width
Define the width of the Board columns.

Board Color (this is where the magic begins)
Colour the board (defined by the Board Padding and Column Space).

Image: Add a tillable image to the board. If you choose a transparent png you'll be able to see the Grid BG Color through the transparent png-file. Cool feature!

Column Color (the magic continues)
Allow or disallow colors of each column. Define colors of each column.

Image: Add a tillable image to the columns. Play a little with transparent png-images...

CSS3
Add a little CSS3 spice to the visitors using CSS3 browsers like Firefox, Google Chrome, Safari and newer versions of Internet Explorer.

Change CSS3 shadow to an inside board shadow. Add a hover shadow to the GridBoard stack… creating a cool effect when visitor hovers over the stack.

Stack Header & Footer
Add a header and a footer (text or any other stack) to the stack outside the Board.

Link & Colors
Really should've been named 'Settings'.

Height: Defines the height of the LinkStyler stack. It'll crop content to the height.

Font Size + Line Height + Align can all be set by default Stacks settings - but it's easier doing it here! Also it's not a new stack - so if I remove the options - I'll leave 'old' users behind… and I will not do that.

Link Top Padding allows you to pad down the link to the exactly where you want.

Link Color: Choose your link color. Overrides the themes default link color.

Hover Color Choose your link hover color. Overrides the themes default link color.

CSS Special
Allows you to add custom css to the link and hover. Search google for cool css3 text examples.