Maîtriser le Positionnement Absolu en CSS

Le positionnement absolu
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre XHTML & CSS
Revoir le teaser Je m'abonne
3,0
Transcription

59,90€ Je commande

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

DescriptionProgrammeAvis
3,0
59,90€ Je commande

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

Les objectifs de cette vidéo sont de :
1. Comprendre le fonctionnement du positionnement absolu en CSS.
2. Savoir appliquer cette technique pour éviter les chevauchements de contenus.
3. Apprendre à utiliser les conteneurs relatifs pour améliorer la flexibilité des mises en page.

Introduction au positionnement absolu en CSS et à ses applications pratiques pour éviter les chevauchements de contenus.

La leçon porte sur l'utilisation de la propriété de positionnement absolu en CSS pour créer des mises en page précises. Le formateur montre comment manipuler les propriétés top, right, bottom, et left pour positionner deux colonnes dans une mise en page donnée. Au cours de la démonstration, plusieurs problèmes sont abordés, notamment le chevauchement des contenus et les limites de l'usage du positionnement absolu pour des éléments dynamiques. Une solution est présentée en utilisant un conteneur avec une position relative pour résoudre certains des problèmes rencontrés. La leçon se termine par une discussion sur les scénarios appropriés pour l'utilisation du positionnement absolu et les conseils pour utiliser des alternatives, comme la propriété float pour les mises en page côte à côte.

Voir plus
Questions réponses
Comment utiliser la propriété 'position' avec la valeur 'absolute' ?
Pour utiliser 'position: absolute', il faut définir la position absolue de l'élément en utilisant les propriétés 'top', 'right', 'bottom', et 'left'. Ces propriétés permettent de précisément positionner l'élément par rapport à son conteneur.
Quels problèmes peut-on rencontrer avec le positionnement absolu ?
L'un des principaux problèmes du positionnement absolu est le chevauchement des contenus, surtout lorsque les éléments ont leurs dimensions modifiées dynamiquement. Les éléments positionnés en absolu ne sont pas pris en compte par les autres éléments de la page.
Pourquoi utiliser un conteneur avec positionnement relatif ?
Utiliser un conteneur avec 'position: relative' permet de définir un contexte de positionnement pour les éléments enfants, ce qui évite les chevauchements et rend la mise en page plus flexible.

Programme détaillé

1 commentaire
3,0
1 vote
5
4
3
2
1
Azraël
Il y a 3 ans
Dans l'ensemble bon cours, toutefois pas adapté au débutant car très touffu.
Je me perds toujours dans les marges, les paddings et les positionnements!
Beaucoup de petites astuces, bienvenues.
Gros défaut: tous les écrans sont flous, et le son est exécrable.