Accordéon: centrer les images

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Accordéon: centrer les images

Message par maximumuse le Mer 9 Oct 2013 - 10:33

Bonjour à toutes et tous Very Happy 

J'ai installé un menu accordéon, merci pour le tuto et le code, chapeau ! Wink 

Bien sûr je suis en train de l'adapter au forum, pour les couleurs c'est assez facile à trouver, mais pour les images c'est plus délicat.

Aucune difficulté pour changer d'image, c'est dans le code HTML

mais impossible de régler leur alignement, de plus je n'arrive pas à comprendre quelle est leur taille idéale, elles sont dans un container figure.

J'ai bidouillé le CSS dans .accordion figure full, avec margin: auto ou tex-align: middle,  mais il se produit des trucs bizarre et aucun centrage.

voilà le site:

http://cinema.forums-actifs.com/

Merci d'avance


Dernière édition par maximumuse le Mer 9 Oct 2013 - 12:29, édité 1 fois

maximumuse
****

Masculin
Messages : 223
Inscrit(e) le : 25/09/2005

http://oric-concours.forumactif.org/
maximumuse a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Accordéon: centrer les images

Message par Milouze14 le Mer 9 Oct 2013 - 11:19

Salut maximumuse,

il faut modifier le div qui est géré en pourcentage ici:
Code:
.accordion figure .full { width: 100%; height: 100%; }
et ici:
Code:
.accordion .slide > div { height: 100%; position: absolute; top: 0; z-index: 10; overflow: hidden; background: white ;}
Ceci devrait suffire:
On change le pourcentage en pixels
Code:

.accordion .slide > div { height: 300px; position: absolute; top: 0; z-index: 10; overflow: hidden; background: white; }
.accordion figure .full { width: 100%; height: 290px;margin:auto; }
Code:

.accordion .slide > div

Est le conteneur, donc plus important que

Code:
 
.accordion figure .full
Qui lui contiendra l'image et on lui applique un margin:auto pour centrer l'image.

En gros , il faut que tu appliques toujours une valeur sur la hauteur plus importante a:
Code:
.accordion .slide > div
et une valeur inférieure sur la hauteur a:
Code:
 
.accordion figure .full

a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4564
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Accordéon: centrer les images

Message par maximumuse le Mer 9 Oct 2013 - 12:28

hé hé merci Milouze, pour la solution et surtout pour tes explications très claires !

sujet résolu

vive Vous I love you 

maximumuse
****

Masculin
Messages : 223
Inscrit(e) le : 25/09/2005

http://oric-concours.forumactif.org/
maximumuse a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum