Comprendre et Maîtriser la Fusion des Marges en CSS

La fusion des marges
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre CSS 3
Revoir le teaser Je m'abonne
4,5
Transcription

89,00€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

DescriptionProgrammeAvis
4,5
89,00€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Les objectifs de cette vidéo sont :
- Comprendre la fusion des marges en CSS.
- Apprendre à stopper la fusion des marges avec différentes techniques.
- Acquérir des compétences pratiques pour maîtriser les espacements dans les projets CSS.

Découvrez comment les marges se comportent en CSS et apprenez à stopper la fusion des marges avec diverses méthodes.

Dans cette leçon, nous explorons le concept de fusion des marges en CSS, une caractéristique essentielle pour les développeurs web. Nous commençons par observer le comportement des marges à travers un exemple pratique ; la balise main contenant un article et un titre h2, montrant comment la marge de ce titre dépasse la boîte conteneur. Nous discutons ensuite de la fusion des marges entre le margin-bottom du titre et le margin-top du paragraphe suivant, qui ne s'additionnent pas mais prennent la valeur la plus grande des deux.

La leçon présente plusieurs solutions pour stopper la fusion des marges indésirables. Nous passons en revue l'ajout d'un padding, l'application d'une bordure, même transparente, et l'utilisation de la propriété overflow avec l'option hidden. Ces techniques permettent de garder les marges à l'intérieur de leurs conteneurs respectifs, évitant ainsi les débordements. À travers des exemples concrets, vous apprendrez à contrôler efficacement les marges dans vos projets CSS, facilitant ainsi la gestion des espacements entre les éléments.

Voir plus
Questions réponses
Qu'est-ce que la fusion des marges en CSS ?
La fusion des marges en CSS est le phénomène selon lequel deux marges verticales se combinent pour n'en former qu'une seule, prenant la plus grande valeur des deux.
Comment peut-on stopper la fusion des marges en utilisant la propriété 'overflow' ?
On peut stopper la fusion des marges en utilisant 'overflow: hidden' sur un conteneur, ce qui empêche les marges internes de dépasser les limites de ce conteneur.
Quelle est la différence entre 'padding' et 'margin' en CSS ?
Le 'padding' crée un espace à l'intérieur de la bordure d'un élément, tandis que la 'margin' crée un espace à l'extérieur de la bordure de l'élément.

Programme détaillé

4 commentaires
4,5
4 votes
5
4
3
2
1
pierre.hiroux
Il y a 4 months
Commentaire
La formation est divisée en 90 modules sans lien entre eux et sans progression pédagogique. Il faut les réorganiser par thème pour donner plus de cohérence et donner de la progression pédagogique à la formation. Multiples fautes d'orthographe dans les textes.
henridjithat
Il y a 1 year
Commentaire
Très bonne formation, étant débutant j'ai beaucoup appris.
yvan.vogel
Il y a 2 years
Commentaire
J'en suis arrivé au bout.. Un vrai marathon. Très longue formation, à mon avis c'est plutôt 30h de cours et non pas 15h.
Après c'est une formation hyper claire et détaillée. L'auteur a fait un panorama complêt sur le CSS3.
g.vanleynseele
Il y a 3 years
Commentaire
Cours très clair et très bien expliqué! Par contre il manque la moitié des fichiers de travail !