Guestbook entries

Here is an example of a guestbook entry:

Each part of the entry has been given a red border to help show what can be configured.

The entry can be split into two parts - the entry details, and the entry itself. The details are taken from the visitor when they sign the book - the visitors name, email address and homepage. If the user didn't enter an email address and/or homepage, the corresponding link is not shown. The date is taken automatically.
As you can see from the example, the entry details are made up from three elements - one surrounding all of the details, one for the visitor's information, and one for the date.

The entry details are enclosed in a <div class='gbTop'>, and the details are then further split into two <p> blocks: <p class='gbDetails'> for the visitors details and <p class='gbDate'> for the date. By splitting the header up in the fashion, you can decide exactly how you want each part of the entry details to be displayed.

The guestbook entry is contained in a single <div class='gbMain'> block, allowing the entry to be formatted differently from the the headers.

The only other CSS entry that needs to be covered is a special entry for any links in the guestbook entry. This includes email and homepage links in the header, any links in the entry itself (if you have HTML entries turned on), and the 'Sign Guestbook' link. These are all in <a class='guestbook'> tags.

This example was created using the following stylesheet:

    div.gbTop {
      border     : thin solid red;
      background : #80C080;
      text-align : center;
    }
    div.gbMain {
      border     : thin solid red;
      background : #8080C0;
      color      : black;
    }
    p.gbDetails {
      width         : 60%;
      margin-left   : 20%;
      margin-right  : 20%;
      margin-top    : 0px;
      margin-bottom : 0px;
      background    : #C0FFC0;
      color         : black;
      text-align    : right;
      font-weight   : bold;
      border        : 1px solid red;
    } 
    p.gbDate {
      width         : 60%;
      margin-left   : 20%;
      margin-right  : 20%;
      margin-top    : 0px;
      margin-bottom : 0px;
      background    : #C0FFC0;
      color         : black;
      text-align    : center;
      font-style    : italic;
      font-weight   : bold;
      border        : 1px solid red;
    }
    a.guestbook {
      color           : blue;
      text-decoration : underline;
    }