Time for action — styling the styleable

  1. Open up your styles.css file. We'll start off by styling the fieldsets and legends:
    fieldset {
    background: #fff;
    border: 1px dotted #83b0ca;
    margin: 10px 20px 0 20px;
    padding:10px;
    }
    legend {
    background: #bed6e3;
    border:1px solid #8fb7cf;
    color: #1C4257;
    padding: 0 5px;
    box-shadow:2px 2px 2px rgba(0,0,0,0.2);
    }
    

    I've selected shades of blue that match the Aristo theme that I selected. If you chose a different theme, feel free to use different colors and styles to match your chosen theme.

  2. Next, we'll style some of the container elements we're using in the form:
    fieldset p { margin: 0 0 10px 0; } fieldset ul { list-style: none; margin: 0; padding: 0; } label { display: block; } ul label { display: inline; width: ...

Get jQuery for Designers Beginner's Guide now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.