CSS Tutorial by Paul Bohman

• Media Types |
• Accessibility Issues

Common Mistakes

As you experiment with styles, make sure you avoid these common mistakes:

Error: Forgetting to link your HTML file to the CSS file

Your styles won't work unless you create a link in your HTML file to the CSS file as explained in the section about external style sheets.

Error: Forgetting to put a semi-colon at the end of the line in a style declaration

If you leave off the semi-colon, the styles won't work properly.

Correct:

p {
	color:red;
	background-color:white;
	}

Incorrect:

p {
	color:red
	background-color:white
	}

Note: Technically speaking, if you leave off the semi-colon on the last style declaration, it won't matter, but if you have more than one style declaration, such as color, margin, padding, and background-color, all of them except the last one must have semi-colons at the end. I usually put semi-colons at the end of every line, just in case I need to add to the list of styles later.

Error: Misspellings

If you type "maggenta" (incorrect) instead of "magenta" (correct), or "margen" (incorrect) instead of "margin" (correct), the styles won't work. All misspellings will cause the style to fail. The word "grey" has two spellings: "gray" and "grey." Both are acceptable.

Error: Improper Syntax

You have to follow the syntax given in the example files. You have to use curly brackets, for example { } not parentheses ( ). You have to remember the colon in-between the style type and the style declaration.

Correct:

background-color: white;

Incorrect (colon missing):

background-color white;

Also incorrect (hypen missing):

background color: white; 

Note: you can write the style declaration with or without a space after the colon. The empty space doesn't matter in this case.

Error: Putting a space between a value and the unit type

Correct:

margin:25em;

Incorrect:

margin: 25 em;