Reference
Reference

Cheatsheet

A short list of frequently used CSS classes for quick reference.

  • wrapper

    Adds vertical spacing below an element (margin-bottom). Used to space out blocks of content

  • small, smaller

    Makes text small and smaller. Useful for lower priority information, tables with large amounts of info, footer content, aside links etc

  • large, larger

    Makes text large and larger. Useful to highlight key information e.g. dates/deadlines, action required in news items etc.

  • alignright

    Used to position content to the right on the main body of content. This could be an article image, some secondary information,
    a list of links etc

  • center

    Center almost anything: text, images etc

  • mobile-center

    Center almost anything: text, images etc on mobile only

  • full-width-mobile

    Make something fill the entire width of the screen on mobile. Can be used for article images for example

  • nth

    Nth styling for lists. Even numbered list items, table rows etc are styled differently to odd numbered items, making content easier to read/follow.

  • excerpt

    Style text like article excerpt. Useful on custom built pages.