Pourquoi ma propriété CSS 'gauche' ne centre-t-elle pas ma division enfant ?

La propriété CSS "gauche" ne fonctionne pas ?

Lorsque vous essayez de centrer la bordure gauche d'un div enfant dans son div parent à l'aide de l'option " gauche : 50 %", l'effet souhaité peut ne pas être obtenu. Cela peut être attribué au positionnement par défaut des éléments HTML, qui est « statique ». Dans cet état par défaut, la propriété "left" n'a aucun effet.

Solution : positionnement absolu ou relatif

Pour activer la propriété "left" pour positionner le div enfant correctement, vous devez définir sa propriété de position sur « absolue » ou « relative ». Cela informe le navigateur que le div enfant doit être positionné par rapport à son élément conteneur plutôt qu'à l'ensemble du document.

CSS mis à jour :

#inner {
    width: 400px;
    height: 300px;
    background-color: #090;
    position: absolute;
    left: 50%;
}

En définissant la position propriété à "absolu", le div enfant se positionne par rapport à son parent et la propriété "gauche" de 50 % positionne sa bordure gauche exactement à mi-chemin dans le parent div.

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!