Tous les composants que vous créez doivent être laissés totalement libres de largeurs, ils doivent toujours rester fluides et leurs largeurs doivent être régies par un système de parent / de grille.
Les hauteurs ne doivent jamais être appliquées aux éléments. Les hauteurs ne devraient être appliquées qu'à des éléments qui avaient des dimensions avant leur intégration sur le site (autrement dit les images et des sprites). Ne jamais mettre de hauteurs sur les balises p, ul, div, ou n'importe quoi d'autre. Vous pouvez souvent obtenir l'effet désiré avec line-height qui est beaucoup plus souple.
Les systèmes de grilles devraient être considérées comme des étagères. Ils contiennent du contenu, mais ne sont pas du contenu eux-mêmes. Vous mettez en place vos étagères puis les remplissez avec vos objets. En mettant en place votre grille séparément de vos composants, vous pourrez les déplacer beaucoup plus facilement que s'ils avaient des dimensions associées, ce qui rend notre code front-end beaucoup plus souple et rapide à utiliser.
Vous ne devriez jamais appliquer du style à un élément de la grille, ces derniers s'utilisent uniquement pour notre mise en page. Appliquez un style au contenu à l'intérieur d'un élément de grille. Ne jamais, en aucune circonstance, appliquer des propriétés de modèle de boîte (box-model) à un élément de grille.
Liste des conseils →