28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai installé un bouton "j'aime" (Facebook) sur un blog.

Lorsque l'on clique dessus, cela fait apparaître un formulaire en-dessous, pour permettre de commenter et de valider.

Le problème, c'est que le formulaire passe à l'arrière-plan par rapport aux blocs du dessous :

http://www.etiennechampollion.com/actu/ (voir dans le pied de page de n'importe quel article).

J'ai donné un positionnement en "relative" à tous les éléments concernés (du moins je pense) avec un z-index de 15 pour le facebook. J'ai aussi mis "visible" pour la propriété "overflow", comme conseillé sur la documentation :

a écrit :
If the Like button is placed near the edge of an HTML element with the overflow property set to hidden, the flyout may be clipped or completely hidden when the button is clicked. This can be remedied by setting setting the overflow property to a value other than hidden, such as visible, scroll, or auto.



.comment_content, .fb_ltr, .plugin, .transparent_widget {
position: relative;		
		overflow: visible;
		z-index: 15;
		
		}

.fb_iframe_widget {

overflow: visible;
position: relative;
z-index: 15;
	
	}	
	
	.fb-like {
		overflow: visible;
position: relative;
z-index: 15;
		}


Je n'arrive toujours pas à le faire passer au premier plan.

Il y a peut-être quelquechose que je n'ai pas compris sur l'empilement, ou bien une classe que j'ai oubliée, je commence à tourner en rond.

Pouvez-vous m'aider à y voir plus clair ?

Merci

Arnaud
Modifié par Arnaud04 (27 Dec 2011 - 12:17)
Salut Arnaud04,

La partie concernant le formulaire Facebook est dans une iframe. Tu ne pourras donc pas surcharger le css. Du coup le code indiqué dans ton message ne sert à rien.

Pourquoi avoir mis des "position relative" et des z-index partout ? Ta mise en page ne le nécessite pas. Si tu les supprimes sur les éléments de class "post" tu n'as plus le souci.
En effet, en supprimant le z-index des classes .post , le problème a disparu.

C'était un reste d'un problème que j'avais eu naguère avec le menu déroulant, que j'avais cru résoudre par ce biais.

Depuis, le post. h2 était resté ainsi, sans raison.

Donc c'est résolu. Merci beaucoup hchtot.