/* neasting, ce qui est à l'intérieur (plus bas)... cible l'élément s'il est présent dans #margin_please (enfant) */ #padding_project { div { border: 3px solid red; border-width: 6px 1px 6px 1px; border-color: red orange green blue; margin: 10px 0px; /* top et bottom == 10px ; left et right == 0px ; */ } #padding_top { padding: 30px; width :400px; tex-align:center; } #padding_left { padding:10px; width :400p; tex-align:center; } #padding_right { padding:10px; width :400px; tex-align:center; } #padding_bottom { padding:20px; width :400px; tex-align:center; } #padding_all { /* neasting */ padding: 10px; /* affecte #padding_all */ border: 2px dashed blue; /* grâce au neasting, je n'ai pas à présiser que le parent est #padding_all */ /* div#padding_all div { */ /* ici toute div enfant de #padding_all est ciblée / affectée */ div { margin: 60px 0px; /* top et bottom == 60px ; left et right == 0px ; */ } div#sub_wrapper { padding: 10px; border-color: yellow; border-width: 10px; } .inline { border-color: #000; border-width: 1px 6px; display: inline-block; } /* ici :not permet de ne pas affecter certaines div avec la class .no_margin */ div:not(.no_margin) { margin: 30px 40px; /* top et bottom == 30px ; left et right == 40px ; */ } /* cela évite d'avoir à écrire une nouvelle instruction spécifique, affectant .no_margin */ /* .no_margin { margin:0 } */ } #padding_left { padding-left: 30px; } #padding_top { padding-top: 30px; width: 50%; text-align: center; } #padding_right { padding-right: 30px; } .laterales { /* blocs au début et fin, meme classe */ width: 20%; } .boxfix { box-sizing: border-box; } .label { width: 100%; display: inline-block; background: #FFF; } .padding_color { background-color: #e3dcff ; } }