Positionner un bloc par rapport a son centreRésolu/Fermé

Question

Bonjour,
Est-ce qu'il est possible en xhtml et CSS de positionner un bloc par rapport à son centre ?
Je m'explique, j'aimerais que la position du bloc par rapport à un côté soit déterminée en fonction du centre du bloc et non pas du coin supérieur gauche.

Merci beaucoup

arthezius · Answer

Tu peux ruser pour parvenir a ce résultat. Exemple: Côté html:

Essai

Côté CSS: div#bloc{ width:900px; position:relative; left:50%; margin-left:-450px; } Voici une solution pour centrer un bloc. margin: 0px auto; n'est pas pris en compte par IE6. Il est donc possible avec ma méthode de centrer un bloc même avec IE6. Tu peux te servir de cet exemple. Autrement, il n'est pas possible de positionner un élément de la manière que tu le souhaiterai. Il faut ruser pour y parvenir.

vivabarcamax · Answer

Merci mais ce n'est pas vraiment cela que je veux faire. Je veux par exemple positionner un bloc à 20% du bord gauche et à 40% du bord supérieur.

Mais si je mets cela :

.explanations
{
	position: absolute;
	left: 20%;
	top: 40%;
}


C'est le coin supérieur gauche qui est à 20% du bord gauche et à 40% du haut.

Or, je voudrais que le centre de ce bloc se trouve à 20% du bord gauche et à 40% du haut...

Existe-t-il une solution ?

Merci

vivabarcamax · Answer

Up !

vivabarcamax · Answer

up !

arthezius · Answer

Comme je l'ai fait dans mon précédent exemple, il faut compenser avec margin.

.explanations
     {
     position: absolute;
     left: 20%;
     margin-left:- # px;
     top: 40%;
     margin-top: - # px;
     }

# correspondra respectivement à la moitié de la largeur et la moitié de la hauteur du bloc que tu places. Je vois pas trop de manière de faire autrement.

vivabarcamax · Answer

Un tout grand merci ! Ca fonctionne !

Positionner un bloc par rapport a son centre

6 réponses

Discussions similaires

Newsletters