Problème avec les messages en accordéon

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

Résolu Problème avec les messages en accordéon

Message par -Krozy le Sam 10 Déc 2016 - 21:21

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :
Voir l'image:
http://i37.servimg.com/u/f37/19/34/61/68/37308810.png

Personnes concernées par le problème : Tous les utilisateurs

Description du problème

Bonsoir,
Je me permet de contacter les membres de ce forum afin d'obtenir de l'aide concernant les messages en accordéons. Je viens de suivre ce tutoriel : cliquez ici. Tous s'affiche correctement. Cependant les images utilisées, ne correspondent pas à mon projet et lorsque j'ai souhaité mettre une image quelconque, elle s'affiche comme sur le screen fournis ultérieurement. Donc j'ai deux questions à vous poser :
- Comment faire en sorte que mon image (orange) prenne toute la largeur/hauteur du slide ?
- Comment mettre du texte par dessus l'image ?

Je vous remercie d'avance.


Dernière édition par -Krozy le Jeu 15 Déc 2016 - 13:25, édité 1 fois

-Krozy
Nouveau membre

Messages : 18
Inscrit(e) le : 18/04/2015

http://betacivil.bbfr.net
-Krozy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec les messages en accordéon

Message par tupac le Dim 11 Déc 2016 - 18:28

Bonsoir Krozy,

Dans votre code html retirer la partie suivante.

Code:
<figure>
<img class="full" src="http://i.imgur.com/SHaqP.jpg" alt="image" />
</figure>
Puis remplacez la par celle-ci.
Code:
<table class="fond_accordéon">
  <tbody>
    <tr>
        <td class="texte_onglet">
Votre contenu ici                                           
        </td>
    </tr>
  </tbody>
</table>

Pour finir rajouter ce code dans le css
Code:
.fond_accordéon{ 
  background-image: url(' votre image ici');
  width:725px;      /* largeur de votre image */
  height:320px;      /* hauteur de votre image */
 }
.texte_onglet{
  color: #000000;        /* couleur du texte */
  padding: 10px;
  vertical-align: text-top;
}
.
avatar

tupac
Membre actif

Masculin
Messages : 2494
Inscrit(e) le : 13/10/2010

tupac a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec les messages en accordéon

Message par lilas le Lun 12 Déc 2016 - 7:13

cheers Merci
avatar

lilas
*****

Féminin
Messages : 805
Inscrit(e) le : 07/08/2004

http://lefofodemacopine.forumactif.com/
lilas a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec les messages en accordéon

Message par -Krozy le Mer 14 Déc 2016 - 13:32

Le problème, si je suis vos conseils, votre code 

@Code a écrit:
.fond_accordéon{ 
background-image: url(' votre image ici');
width:725px;      /* largeur de votre image */
height:320px;      /* hauteur de votre image */
}



L'image ce coupe :
Image original ==> http://i37.servimg.com/u/f37/19/34/61/68/lpromo10.png avec pour largeur 759 (j'ai arrondis à 770 pour essayer) et de hauteur 300 (j'ai laissé 320)

Voici le rendu : http://i37.servimg.com/u/f37/19/34/61/68/captur10.png

Y'a-t-il possibilité de faire en sorte que l'image rentre avec sa hauteur et largeur d'origine et faudra-t-il à chaque fois que je redimensionne l'image ?

Merci de ton aide !

-Krozy
Nouveau membre

Messages : 18
Inscrit(e) le : 18/04/2015

http://betacivil.bbfr.net
-Krozy a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec les messages en accordéon

Message par tupac le Mer 14 Déc 2016 - 22:51

Bonsoir Krozy,

Désolé de ne pas être intervenu plus tôt j'ai été absent.

Remplacer votre css par celui la et normalement votre image va s'adapter automatiquement a l'onglet.

Code:
.fond_accordéon{
  width: 100%;
  height: 100%;
  background-image: url('http://i37.servimg.com/u/f37/15/55/14/56/lpromo11.png');
  background-position: center center;
  background-repeat: no-repeat;
  -moz-background-size: 100% 100%;   
  -o-background-size: 100% 100%;     
  -webkit-background-size: 100% 100%; 
  background-size: 100% 100%;       
 }
.texte_onglet{ 
  color: #fff;        /* couleur du texte */
  font-family: 'Segoe Print', sans-serif;
  padding: 5px;
  vertical-align: text-top;
}

avatar

tupac
Membre actif

Masculin
Messages : 2494
Inscrit(e) le : 13/10/2010

tupac a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec les messages en accordéon

Message par -Krozy le Jeu 15 Déc 2016 - 13:25

Je vous remercie cela fonctionne parfaitement !
Mon problème est donc résolu

-Krozy
Nouveau membre

Messages : 18
Inscrit(e) le : 18/04/2015

http://betacivil.bbfr.net
-Krozy 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