communauté Apprendre Bibliothèque d'outils Loisirs

Français

Maison > interface Web > tutoriel CSS > Pourquoi ma division absolument positionnée ne bouge-t-elle pas ?

Pourquoi ma division absolument positionnée ne bouge-t-elle pas ?

Linda Hamilton

Libérer： 2024-11-30 03:48:14

original

627 Les gens l'ont consulté

Why Isn't My Absolutely Positioned Div Moving?

Le positionnement absolu ne fonctionne pas

Dans une tentative de positionner un div avec l'ID "absPos" de manière absolue dans son div parent, un développeur a rencontré un problème où le div restait en haut à gauche de la page coin.

Explication :

Les éléments avec un positionnement absolu sont déplacés en fonction de leur offsetParent, qui est l'ancêtre positionné le plus proche. Dans l'exemple de code fourni, aucun ancêtre n'avait d'éléments « positionnés », ce qui entraînait le décalage du div par rapport à l'élément body, son offsetParent.

Solution :

Pour rectifier ce problème, position:relative doit être appliqué au div parent. Cela le transforme en élément positionné et l'établit comme offsetParent pour son enfant.

Code modifié :

<html>
    <body>
        <div>

Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source：php.cn

Article précédent：Comment puis-je insérer dynamiquement du texte dans une page Web à l'aide de CSS ou de JavaScript ? Article suivant：Comment la pseudo-classe :has() élimine le besoin de hacks JavaScript en CSS

Déclaration de ce site Web

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Derniers articles par auteur

Derniers numéros

function_exists() ne peut pas déterminer la fonction personnalisée Function test () {return true;} if (function_exists ('test')) {echo "le test est une ...

Depuis 2024-04-29 11:01:01

2043

Comment afficher la version mobile de Google Chrome Bonjour professeur, comment puis-je changer Google Chrome en version mobile ?

Depuis 2024-04-23 00:22:19

2203

La fenêtre enfant exploite la fenêtre parent, mais la sortie ne répond pas. Les deux premières phrases sont exécutables, mais la dernière ne peut pas être implémentée...

Depuis 2024-04-19 15:37:47

1861

Il n'y a aucune sortie dans la fenêtre parent document.onclick = function(){ window.opener.document.write('Je suis la sortie de la fenêt...