create great magazine layouts
for the iPad
More semantics, less divs
Magazine Grid takes use of html5-elements to structure your magazine page.
<article> <nav class="pagina">…</nav> <section> <p class="grid x5">…</p> <p class="grid x2">…</p> <p class="grid x1">…</p> </section> <section class="gutter column2"> <p> … </p> </section> </article>
An article-element wraps up your page, sections define the portions of content. Inside the sections you define which elements should match the grid and how wide they are. Section class=gutter is a special type which provides a nice white-space around the textblock for best readability. It can even have 2 or 3 columns.
Made for the iPad
Magazine Grid is designed to work best on the iPad in portrait and landscape orientation. The simple 8 column grid uses the full display without leaving unnecessary margins.
iPhone compatible? Yes, Sir!
Of course Magazine Grid has a nice fallback style for devices with smaller displays such as the iPhone or iPod Touch. It linearizes the grid and puts the main focus on readability.
Lighter than 4kB
Magazine Grid is superlight to load fast on mobile devices. That is why it doesn't care about oldschool browsers like IE6 or Netscape.