[resolu] Positionnement absolute dans un div relatif

Bonjour, après avoir perdu la moitié de mes cheveux et m'être rongé les ongles jusqu'au sang je me résigne à venir ajouter un topic de plus sur ce forum qui constitue mon dernier recours maintenant (c'est dire si je suis désespéré).

Bon alors mon problème c'est que j'ai un div aux dimensions limités (et donc scrollable) et en position relative.

Ensuite à l'intérieur de ce div j'ai une certaine somme d'images transparentes superposées (implique un positionnement absolute)

Mais voila : mes images (toutes de dimensions égales et supérieures à mon div conteneur) dépassent du div en question au lieu de déclencher un scroll.

Avec FF ça marche pourtant nikel mais avec ce fichu IE .... rrrr

En fait quand il n'y a qu'une seule image plus grande mais en positionnement relatif elle s'insère bien et devient scrollable avec le div mais c'est le positionnement absolu de mes images superposées qui pose problème (du moins c'est ce que je crois).

Voila mon code HTML :

<div id="contenu">
    Retrouvez nos partenaires dans chaque département :<br/><br/>
    <div id="carte">
	<div id="carteFrance"></div>
	<div class="dpt" id="img56" style="background-image: url(image/carteFrance/56.gif)"></div>
	<div class="dpt" id="img29" style="background-image: url(image/carteFrance/29.gif)"></div>
	<div class="dpt" id="img22" style="background-image: url(image/carteFrance/22.gif)"></div>
        etc...
    </div>
</div>

Mon code CSS :

#carte {
	position:relative;
	width:743px;
	height:885px;
	margin:auto;
	padding-left:0px;
}

#carteFrance {
	position:relative;
}

.dpt{
	position:absolute;
	width:743px;
	height:885px;
	padding:0px;
	left:0px;
	top:0px;
}

Modifié par nash0320 (07 Jun 2007 - 14:43)

vous n'avez pas une idée???
Je joint des capture d'écran pour illustrer mon problème :

avec internet explorer :


avec firefox :

Modifié par nash0320 (06 Jun 2007 - 11:41)

malheuresement non ce n'est pas encore à l'opérationel (je précise que c'est dans le cadre de mon taf)

La question qui me turlupine c'est : peut-on positionner un élément en absolute mais par rapport à un conteneur (et non pas par rapport au body) ???

Re,

Ben oui, il suffit de mettre ton conteneur en relative et d'y inclure ton contenant en absolute

nash0320 a écrit :
La question qui me turlupine c'est : peut-on positionner un élément en absolute mais par rapport à un conteneur (et non pas par rapport au body) ???

Oui, en positionnant le conteneur en relatif, comme tu l'as fait.
Ensuite, que cela bugue avec IE si en plus le conteneur ou son parent sont en hauteur fixe + overflow: auto, ça ne m'étonne pas plus que ça.

À vrai dire, le vrai problème ne me semble pas être le fait que ça dépasse, mais plutôt le fait qu'on ait voulu figer ce bloc en hauteur et utiliser une barre de défilement interne. C'est ce qu'on appelle une erreur de conception.

De même, je suis intrigué par ce jeu d'images transparentes superposées. Que s'agit-il de faire exactement, et une image map n'était-elle pas plus indiquée ?

merci florent, en fait tu as raison j'ai une map (non renseignée ici car pas nécessaire pour la résolution de mon pb css).
En fait c'est une carte de france avec des départements réactifs qui lancent une recherche ... voila pour le role de ma carte.

Sinon si ma boite est scrollable et pas adaptée a la hauteur de ce qu'elle contient c'est parce que le site est entièrement fluide donc il prend les dimensions du client.
Ce qui fait que mon pied de page est accroché en bas de l'écran, mon entete accrochée en haut et le reste (le conteneur de ma carte) s'adapte pour s'accrocher en haut et en bas.

C'est mon cahier des charges qui est comme ça j'y peut pas grand chose.

nash0320 a écrit :
C'est mon cahier des charges qui est comme ça j'y peut pas grand chose.

Oui, il y a très clairement un problème d'éducation des décideurs au média Web.

bah en même temps je vois pas ce qu'il y a de chocant à faire des sites fluides. Alsacreation est lui-même fluide en ce qui concerne la largeur.
C'est pour donner un aspect "logiciel".

Bon pour en revenir sur mon problème je crois que je tient peut être un début de solution.
Je laisse tomber les divs transparents en absolute pour les mettre tous en relatif les uns dans les autres.
L'inconvénient c'est l'imbrication de tous les divs et mon code html étant généré par javascript c'est plus lourd à mettre en oeuvre et la structure DOM devient pas pratique du tout mais bon j'ai fait quelques essais et ça a l'air de marcher...

je vous redis ce que ça donne dans l'après midi.

En attendant je suis toujours à l'écoute de vos suggetions merci.

nash0320 a écrit :
bah en même temps je vois pas ce qu'il y a de chocant à faire des sites fluides. Alsacreation est lui-même fluide en ce qui concerne la largeur.

Il n'y a pas de problème à faire de sites fluides, au contraire. Par contre, toute interface Web qui repose sur une barre de défilement interne (autre que celle, globale, du navigateur) ou encore qui place des éléments d'interfaces fixes (réduisant d'autant l'espace utile d'affichage du contenu) est potentiellement problématique.

Mon avis est que, sauf cas particulier, avoir recours à ces dispositifs est une erreur de conception.
Modifié par Florent V. (06 Jun 2007 - 16:47)

Problème résolu en jartant tous ce qui peut être en position absolute car impossible a incorporer dans un flux relatif avec IE alors qu'avec FF c'est niquel.

Bon j'ai du me faire une putain d'arborescence de divs relatifs vides imbriqués les uns dans les autres avec une image de fond pour simuler une superposition de divs absolus.
Enfin bref c'est un peu la merde mais ça marche.

PS : je sais pas trop comment faire pour mettre le topic en [résolu]

nash0320 a écrit :
PS : je sais pas trop comment faire pour mettre le topic en [résolu]

Hello,

Même après avoir relu les Règles et la FAQ du Forum ? On peut pourtant difficilement louper cette information

mea culpa manque de curiosité pour chercher.

nash0320 a écrit :
mea culpa manque de curiosité pour chercher.

Ben disons que les Règles sont censées êtres lues et approuvées lors de l'inscription