grail css layouts

Grail is a flexible starting point for any website layout

Creating a good site layout can be hard, but it doesn't need to be. This is the problem that grail-css solves.

Six elements, six classes of the same name, one of three possible layout classes on the html element and, voila, you're done!

Here are the elements you need to remember. Body, header, nav, main, aside, and footer. Grail's boilerplate is as follows:

<html class="html layout-standard">
<body class="body">
    <header class="header"></header>
    <nav class="nav"></nav>
    <main class="main"></main>
    <aside class="aside"></aside>
    <footer class="footer"></footer>
</body>
</html>

How do I get started?

See Getting Started for next steps.