Discussion :

[Mistic100]

Bonjour,
j'ai un problème de css épineux

Mise en situation :
C'est la page de consultation d'une image au sein d'une galerie, on a donc un bloc principal largeur automatique, aucun problème ici. En dessous il y a un tableau avec les information de l'images, taille automatique centré. Et autour de ce tableau des miniatures de navigation (en float left et right) pour passer à la page suivant ou précédente. Enfin un autre bloc en dessous aussi de largeur automatique (qui possède clear:both pour bien être sous les miniatures si le tableau est petit)

Maintenant cette page a été modifiée, j'ai ajouté un menu à gauche de la page, il est en float:left, et le reste de la page se voit affublé d'un margin-left.
Et donc le problème vient du dernier bloc, si on lui laisse clear:both il se place toujours sous le menu, ce qui est gênant si c'est un grand menu, mais si on l'enlève il est partiellement recouvert par les miniatures de nav...

Comment faire un "clear:both mais pas trop" pour que le dernier bloc soit sous les miniatures ET au même niveau que le menu ?

ps : j'ai bien sur pensé à mettre tableau d'infos et miniatures dans un autre tableau, ce qui m’affranchirait des float:right/left, mais outre le fait que c'est pas beau, ça pose des problèmes internes (taille trop variable des miniatures etc.)

[kabbabi]

Bonjour,

Attribue un z-index à toutes les balises. Ensuite, tu attribues UN MÊME z-index au menu et à ce que tu veux qui soit dans le même z-index (propriété de superposabilité). C'est un nombre entier qui peut être négatif !
exemple : Pour le menu, si c'est une div :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<div id="menu" name="menu" style="position:absolute;z-index:-1;">
{ ... } <!--Ton menu-->
</div>

{Ta page}

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<div id="div_à_mettre_au_même_niveau_que_le_menu" style="position:absolute;z-index:-1;">
</div>

La position:absolue doit impérativement être mise.
Un seul problème se pose : il faudra jouer avec left et top