mettre des images au même format

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • mettre des images au même format

    Bonjour,

    Je cherche à faire la même chose que sur cette page : http://classiquesetcontemporains.com/ c'est à dire que toutes les images (celles du centre) aient le même format.
    J'ai beau le définir, rien n'y fait.
    Mon code est le suivant :

    <table style="height: 250px;" border="0" width="550px;" cellspacing="2" cellpadding="2" align="center">
    <tbody>

    <tr>

    <td align="center" valign="top" width="140" height="205">
    <div><img src="images/couv_border_black/chardon.jpg" alt="" width="140" height="195" /></a></div>
    </td>

    <td width="15"> </td><!----- séparateur --->

    <td align="center" valign="top" width="140" height="205">
    <div><img src="images/couv_border_black/glaive.jpg" alt="" width="140" height="195" /></a></div>
    </td>

    .../....
    .../....
    </tr></tbody></table>

    Si vous aviez un modèle à appliquer ce serait parfait.

    Merci d'avance
    Cordialement
    Gilles

  • #2
    Re : mettre des images au même format

    Salut
    Si ton but est d'ajouter des articles en cliquant dessus ?
    Si c'est le cas tu peux regarder hikashop

    Si tu veux des images avec une description en dessous tu peux regarder simple image gallerie http://www.joomlaworks.net/extension...ge-gallery-pro ou phoca galerie, ...

    Mais n'utilises pas de tableau, surtout si ton site est responsive
    Auto-entrepreneur spécialiste Joomla https://www.stylitek.com

    Joomladay 2023 https://www.joomladay.fr/ 2 jours à ne pas manquer

    Commentaire


    • #3
      Re : mettre des images au même format

      Tu peux aussi si ton site uitlises un framework utiliser la grille du framework
      Auto-entrepreneur spécialiste Joomla https://www.stylitek.com

      Joomladay 2023 https://www.joomladay.fr/ 2 jours à ne pas manquer

      Commentaire


      • #4
        Re : mettre des images au même format

        Au lieu d'utiliser une table, je te propose d'utiliser des div avec cette classe

        .vignette{
        float:left;
        width:23%;
        margin:1px;
        min-width:140px;
        height:205px;
        display:inline-block;
        vertical-align:top;
        }

        <div style="width:80%;">
        <div class="vignette"><img src="images/couv_border_black/chardon.jpg" alt="" width="140" height="195" /></a></div>
        <div class="vignette"><img src="images/couv_border_black/glaive.jpg" alt="" width="140" height="195" /></a></div>
        </div>

        Cela devrait afficher tes images 4 par 4 dans une zone de 550 de large et en plus c'est responsive

        où 80% serait l'équivalent de ton 550px mais c'est à préciser

        Ce que te propose tofff est encore plus simple
        Dernière édition par webcrea à 11/05/2016, 13h09
        Christophe
        http://www.webcrea.fr

        Commentaire


        • #5
          Re : mettre des images au même format

          Bonjour
          Merci à tous pour votre aide.
          Avant d'utiliser une galerie je dois être sûr que ça ira dans ma page d'accueil présentée avec des onglets (www.chumeditions.com)
          Pour le framework, je ne sais pas ce que c'est ni si c'est déjà dans joomla.
          J'ai essayé le code de webcrea mais quand j'enregistre la première partie de code disparait. Je l'ai mise dans des balise <style> <head>, sans succès.

          Merci encore pour aide à venir
          A+
          Gilles

          Commentaire


          • #6
            Re : mettre des images au même format

            il faut désactiver l'interdiction d'insérer du script dans l'éditeur (voir le plugin de l'éditeur tinymce). Dans le champ "Eléments prohibés" tu mets x (si le champ est vide, joomla te remets les éléments prohibés de base)

            et oui le premier bout de code est du css
            Christophe
            http://www.webcrea.fr

            Commentaire


            • #7
              Re : mettre des images au même format

              Merci. je regarde ça au plus vite.
              Le code css il faut le mettre entre <head><style>code CSS</style></head> ?

              Commentaire


              • #8
                Re : mettre des images au même format

                Envoyé par felinity Voir le message
                Merci. je regarde ça au plus vite.
                Le code css il faut le mettre entre <head><style>code CSS</style></head> ?
                oui
                <style type="text/css">

                ...................
                Christophe
                http://www.webcrea.fr

                Commentaire


                • #9
                  Re : mettre des images au même format

                  Rien à faire, le code CSS ne reste pas malgré le x dans l'éditeur Tiny. Il y a dessous une zone "éléments autorisés" qui est vierge puis une autre déjà renseignée.
                  Comme je suis sur une page avec des onglets, peut-être est-ce ça qui perturbe ?
                  Je mets le code. J'ai essayé avec le CSS au-dessus et au-dessous du {tab}, c'est pareil.

                  <head>
                  <style type="text/css">
                  .vignette{
                  float:left;
                  width:23%;
                  margin:1px;
                  min-width:140px;
                  height:205px;
                  display:inline-block;
                  vertical-align:top;
                  }
                  </style>
                  </head>

                  <hr id="system-readmore" />
                  <p>{tab ACTUALITÉ|red}</p>

                  <div style="width: 80%;">
                  <div class="vignette"><img src="images/couv_border_black/le_chardon.jpg" alt="" width="140" height="195" /></div>
                  <div class="vignette"><img src="images/couv_border_black/glaive.jpg" alt="" width="140" height="195" /></div>
                  <div style="width: 80%;">
                  <div class="vignette"><img src="images/couv_border_black/le_chardon.jpg" alt="" width="140" height="195" /></div>
                  <div class="vignette"><img src="images/couv_border_black/glaive.jpg" alt="" width="140" height="195" /></div>

                  Commentaire


                  • #10
                    Re : mettre des images au même format

                    Envoyé par toffffe Voir le message
                    Tu peux aussi si ton site uitlises un framework utiliser la grille du framework
                    Si quelqu'un me donne des précisions là-dessus, peut être que je finirai par m'en sortir.
                    Joomla 3 utilise-t-il un framework ?
                    Merci

                    Commentaire


                    • #11
                      Re : mettre des images au même format

                      pas besoin des <head>...</head>

                      Tu pourrais ajouter la règle css dans la feuille de style de ton template. Je ne sais pas quel template tu utilises mais il y a souvent un custom.css ou override.css
                      Ce qui serait mieux puisque tu pourras ainsi le réutiliser dans d'autres articles
                      A ce moment là ne mets que la déclaration

                      .vignette{
                      float:left;
                      width:23%;
                      margin:1px;
                      min-width:140px;
                      height:205px;
                      display:inline-block;
                      vertical-align:top;
                      }
                      Christophe
                      http://www.webcrea.fr

                      Commentaire


                      • #12
                        Re : mettre des images au même format

                        Il est clair que je ne fais ce qu'il faut.
                        le fichier custom.css n'a que ça :
                        /* Copyright (C) YOOtheme GmbH, http://www.gnu.org/licenses/gpl.html GNU/GPL */
                        /*
                        * Custom Style Sheet - Use this file to style your content
                        */
                        h3.module-title{background: #7DA939;color: #fff;height:35px;}

                        .vignette{
                        float:left;
                        width:23%;
                        margin:1px;
                        min-width:140px;
                        height:205px;
                        display:inline-block;
                        vertical-align:top;
                        }

                        Quand je mets le reste du code dans l'article, c'est tout l'article qui disparait.
                        Soit il y a un conflit qq part, soit il y a des déclarations à faire que je ne fais pas faute de savoir lesquelles.

                        Commentaire


                        • #13
                          Re : mettre des images au même format

                          Tu insères bien le code en mode code ? Tu as un bouton en bas à droite "Basculer l'éditeur"
                          Christophe
                          http://www.webcrea.fr

                          Commentaire


                          • #14
                            Re : mettre des images au même format

                            Oui, ça pas de problème, je connais.
                            Comment depuis la page d'accueil le script <div class="vignette">... sait qu'il doit aller dans le fichier "custom.css" ?

                            Commentaire


                            • #15
                              Re : mettre des images au même format

                              Envoyé par felinity Voir le message
                              Oui, ça pas de problème, je connais.
                              Comment depuis la page d'accueil le script <div class="vignette">... sait qu'il doit aller dans le fichier "custom.css" ?
                              Le script ne va pas dans le fichier mais custom.css est chargé et dès qu'une div ou autre y fait référence les styles sont appliqués.

                              Regarde la source de ta page pour être sût qu'il est bien chargé

                              As-tu une url?
                              Christophe
                              http://www.webcrea.fr

                              Commentaire

                              Annonce

                              Réduire
                              Aucune annonce pour le moment.

                              Partenaire de l'association

                              Réduire

                              Hébergeur Web PlanetHoster
                              Travaille ...
                              X