Ordre des déclarations

Les déclarations de propriétés similaires devraient être regroupées ensemble selon cet ordre :

• Positionnement
• Modèle de boîte
• Typographie
• Visuel

Le positionnement vient en premier car cela peut retirer un élément du flux normal du document et overrider les styles relatifs au modèle de boîte. Le modèle de boîte vient ensuite car il influe sur les dimensions et le placement de l'élément.

Tout le reste agissant à l'intérieur de l’élément ou sans impacter les deux sections précédentes, vient ensuite.

.declaration-order {
  /* Positionnement */
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100;

  /* Modele de boite */
  display: block;
  float: right;
  width: 100px;
  height: 100px;

  /* Typographie */
  font: normal 13px "Helvetica Neue", sans-serif;
  line-height: 1.5;
  color: #333;
  text-align: center;

  /* Visuel */
  background-color: #f5f5f5;
  border: 1px solid #e5e5e5;
  border-radius: 3px;

  /* Divers */
  opacity: 1;
}