What you need:
– Basic knowledge in HTML and CSS.
– A Mac and Xcode (no programming skills required) for exporting the app.

Inside the CSS

What’s a CSS file? CSS Style sheets include all visual appearances of objects, texts and media. For example a modification of a headline’s font size in the style sheet will reflect a change of the headline throughout the whole publication.

A brief overview of the main style sheets

Use this CSS template as a start for your dossier-specific stylesheet.

The main stylesheet. Page widths are defined here. All other CSS files containing styling of typography etc. are also being imported.

structure.css stores all styles concerning the structure, such as column widths, “content-element” margins etc.

Text and headline styles are part of this file (font face, font size, line-height etc.).

All custom fonts, included via @font-face (for more information, see “custom fonts”).

Contains all styles concerning the “table of content” (on iOS devices activated with a doubletap) and the navigation bar on desktop browsers.

display-grid.css (deactivated by default)
Display the underlying grid of “content-element” by enabling “display-grid.css”. Just uncomment (delete the “/*” and “*/”) the following lines in the beginning of the main style sheet “styles.css”.

/*Turn on the visual grid view by deleting the "/*"...
@import url('display-grid.css');
... and this » */

Media related appearances, like image widths and f.e. styling of captions are stored here.

Module-related CSS files

Manages the appearance of the module „slideshow“. Note: The styling of the captions are saved in “media.css”, because they are used also in other modules.

The styles of the module “audio”.

The styles for the module “card-flip”.

Laker is now on github! Please discuss issues, suggestions or tipps in the github forums of Laker. Thanks! ;)

2 Responses to “Inside the CSS”

  1. Hello :)
    Is there any solutions to render correctly on IE9 (desktop)?
    If I use conditional stylesheets it will solve anything or what kind of solution do I have to do to make it work?

    Best regards (excelent framework by the way :) )

    João Vinagre

  2. Hey there!
    Could you post in the github-Forums about the problems?
    What exactly doesn’t render correctly.


Leave a comment, suggestion or question.

You must be logged in to post a comment.