1. What is it?

The DUI CSS framework consists of three files:

  • normalize.css
  • typography.css
  • layout.css

They are designed to be used simultaneously via one of the following:

  • dui.css
  • dui-min.css (compact)

Any additional CSS you require should be placed in a custom.css file in your site's /css directory.

Ensure you place it after the dui-min.css for inheritance to function as expected.

2. Where is it?

Include the code below in the head section of your document.

3. How do I use it?

Layout

There are two widths available:

  • 750px
  • 900px

Use one of the following to encapsulate all elements in your document.

Templates

Use the container class in conjunction with a t class, 1-6.

  1. t1

  2. t2

  3. t3

  4. t4

  5. t5

  6. t6

Simply add divs with class names of left-column, center-column and right-column inside.

You can use one or multiple container divs, each with a different t value depending on your needs.

4. Example

View full example document