Using Style Sheets with Individual DiscussionApp Messages

Below is a diagram which illustrates style sheet selectors with their corresponding elements for an individual message:

discussionapp style sheet selectors diagram

Below is the style sheet that was used for the table above. Feel free to copy and modify it.

.author_cell {
        background-color: #8FF;
        font-size: 80%;
        padding-left: 5px;
        padding-right: 5px;
}

.date_cell {
        font-size: 80%;
        font-style: italic;
        padding-left: 5px;
        padding-right: 5px;
}

DIV.responses {
        border: 1px dashed black;
        font-size: smaller;
        padding:1em;
        margin: 8px;
}

UL {
        list-style-position:    inside;
        list-style-type:        none;
}

INPUT { background-color: white;
        border:         1px solid black;
        font-family:    Arial,Helvetica;
}

DIV.message_and_thread {
        border: 1px solid black;
}

DIV.message {
        border: 1px solid blue;
        margin: 8px;
}

DIV.message_text {
        border: 1px solid gray;
        margin: 1em;
}

DIV.headers {
        border: 1px solid red;
        margin: 1em;
}

DIV.header {
        border: 1px solid #CCC;
        margin: 4px;
        width: 30em;
        font-size: smaller;
}

A,SPAN.author_header {
        font-weight: bold;
        font-size:   120%;
}

SPAN.subject_header {
        margin-left: 1em;
        font-style: italic;
}

SPAN.date_header {
        margin-left: 1em;
}

SPAN.ip_header {
        margin-left: 1em;
}

DIV.buttons {
        background-color: #DDF;
        padding: 5px;
        text-align: center;
        margin: 1em;
}

SPAN.parent_entry {
        background-color: #FEE;
}

SPAN.current_entry {
        margin: .5em;
}

SPAN.current_entry {
        background-color: #EEE;
}

Please post questions regarding style sheets and DiscussionApps on the DiscussionApp Forum.

Back to Style Sheets and DiscussionApps