More with CSS!

Return to Dreamweaver CSS...    Return to XHTML CSS...

What else can we do with CSS?

• Emphasis: color and different font size
• Horizontal rule: color
• Heading: "negative" bottom margin of -10 so the horizontal rule can "touch" the bottom (it takes away the space between the heading and the horizontal rule.)
• Special class: indenting text

How about indenting some text?

You may wish to indent the text without putting into a list. Wouldn't this be a nice addition to addresses?
All of the text inside this special class will be indented by 30 pixels.

We do this by creating a special class called .indent that has padding-left: 30 pixels.

CSS Coding:

body { background-color: #ccffcc; color: #003300; font-size: small; font-family: "Comic Sans MS", Arial, sans-serif; }

em { color: #009900; font-size: 1em ; }
h2 { margin-bottom: -10px; }
hr { color: #333; }

a:link { color: #3333CC; text-decoration: underline; }
a:visited { color: #663399; text-decoration: underline;}
a:hover { color: #ccffcc; text-decoration: none; background-color: #030; }
a:active { color: #3399CC; text-decoration: none; }

.indent { padding-left: 30px; }