28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous,


J'utilise des éléments flottant sur une partie de mon site et l'un d'entre eux ce place assez étrangement.

Voici une page d'exemple : http://toutenkamion.net/cartes/albanie.php

Ca concerne la carte du pays qui ce trouve plus basse que prévue. J'ai tenté plusieurs modifications et j'en conclu que ce décalage est du à la présence du drapeau du pays.

Si le drapeau n'est pas présent, le positionnement de la carte est correct.

Est ce que quelqu'un peut m'en dire un peut plus sur la raison de ce positionnement étrange?
Administrateur
Hello,

A priori, c'est une mauvaise compréhension du positionnement flottant.

Extrait du tutoriel :
a écrit :
Récapitulatif. Attention à bien comprendre le fonctionnement du positionnement flottant :

* L'élément est d'abord placé normallement dans le flux. Donc si un autre élement bloc est placé avant lui, l'élément flottant se positionnera en dessous; et si un élément bloc le suit, ce dernier sera placé dessous. Bref, le comportement classique du positionnement en flux
* Ensuite l'élément qui a reçu la propriété float est "poussé" à gauche ou à droite de son conteneur.
* Les éléments qui le suivent au sein du conteneur se placent alors autour de lui.


Me trompe-je ?
percherie a écrit :
Ca concerne la carte du pays qui ce trouve plus basse que prévue.
Et où devrait-elle être positionnée? "Plus haut", j'imagine, mais à quelle hauteur exactement?
En effet je n'ai pas précisé la position souhaitée.

Théoriquement le haut de la carte doit ce trouve au même niveau que le haut du drapeau.

Concernant le tutoriel je pense avoir saisi le principal mais pas tout car sinon il n'y aurai pas de problème Smiley cligne

La carte est placée en flottant après deux autres éléments flottant (pour des question de superposition d'élément).

Ce qui m'intrigue c'est que la suppressions de l'élément flottant "drapeau" corrige le problème. Si je lit bien le tutoriel, l'élément flottant "dl" devrait reproduire la même erreur ce qui n'est pas le cas.
J'ai contourné le problème en supprimant le positionnement d'un élément mais il est clair que ça viens d'une erreur de compréhension de ma part sur les éléments flottant.

Surement qu'un de ces jours je comprendrais d'où ça venait mais là je jette l'éponge