Portal Login

Directory

Portal Layout

This layout's structure is a take off of a typical portal design from a few years ago. The layout allows for different column configurations in the main content area of the layout that through the use of CSS. This page has what is called an NWN or narrow-wide-narrow three-column layout. A look through the stylesheet will find classes for other column configurations and you can always define your own.

The CSS structure of the body begins with a containing DIV that defines what type of column structure there is. Immediate child elements are the columns themselves, but named in a generic fasion (tab-column-one, tab-column-two, etc.). This makes changing the the column layout a simple matter of changing the class of DIV containing the columns.

A DIV element with a class of portlet contains each portlet. These DIV elements could also be given an ID attribute and the stylesheet edited to include styles specific to that individual portlet.

The stylesheet for this layout includes a lot of generic classes that can be used to create elements common to portals. It would be worth looking through the stylesheet to see what's there.

This layout is compatible with Opera, Firefox, Safari, Chrome, Internet Explorer version 6 and later, and probably any modern browser.

Upcoming Events

  • Event Title
    Date & Time
    Summary of event.
  • Event Title
    Date & Time
    Summary of event.
  • Event Title
    Date & Time
    Summary of event.
  • Event Title
    Date & Time
    Summary of event.