heimdallrj

// Incorrect:
<div class="article">
  <div class="title">Title</div>
  <div class="content">Article contents goes here!</div>
</div>

.article {}
.article .title {}
.article .content {}

heimdallrj

// Incorrect
<ul id="list-1"></ul>
<ul id="list-2"></ul>
<img class="main-logo" />

#list-1, #list-2 {}
.main-logo {}

// Correct:
<ul class="list" id="list-1"></ul>

heimdallrj

.kf-container {}
.kf-alerts {}

heimdallrj

.clearfix {
  clear: both;
}

heimdallrj

// Incorrect:
#sidebar {
  background-color: #fff;
  background-image: (bg.png);
  background-position: 0 0;
}

// Correct:
#sidebar {
  background: #fff url(bg.png) repeat-x 0 0;

heimdallrj

// Incorrect:
div#a, dv#b {}

// Correct:
.ab {}

heimdallrj

.alert {
    background-color: #eee; /* temporarily put here */
  border: 1px solid #ccc;
  display: block;
  font-size: 10px;
  padding: 5px 10px;
}

.box {
  top:    0;

heimdallrj

.alert {
  border: 1px solid #ccc;
  padding: 5px 10px;
  font-size: 10px;
  x-display: block; /* disabled */
}

heimdallrj

.alert {
  border: 1px solid #ccc;
  padding: 5px 10px;
  font-size: 10px;
  display: block;
    background-color: #eee; /* temporarily put here */
}

heimdallrj

.alert {
  border: 1px solid #ccc;
  padding: 5px 10px;
  font-size: 10px;
  display: block;
}

.alert__error { color: red; }