Bugl — code interview practice that feels like a game

Loading lesson path

Errors in CSS can lead to unexpected behavior or styles not being applied correctly.

This page shows common CSS mistakes, and how to avoid them.

Missing Semicolons

Forgetting a semicolon at the end of a property declaration can break the style rule.

Example

Formatted code

.bad {
  color: red
  background-color: yellow;
}

Live preview

Using a property name that does not exist will simply be ignored by the browser.

Example

Formatted code

.bad {
  colr: blue;
  font-size: 16px;
}

Live preview

Correct properties but invalid values will also be ignored.

Example

Formatted code

.bad {
  width: -100px;
  color: green;
}

Live preview

If you forget to close a brace } , the entire rule may be ignored.

Example

Formatted code

.bad {
  padding: 20px;
  margin: 10px;

Live preview

Typos like extra colons or misplaced braces can cause rules to break.

Example

Formatted code

.bad {
  color:: blue;
}

Live preview