Partage
  • Partager sur Facebook
  • Partager sur Twitter

problème de position de texte sous les images

Aidez moi svp ( je suis en pls)

    14 janvier 2021 à 13:39:54

    <img src="image 1.jpg" alt="image 1" style="margin-right: 20px;" />
            <div><strong>Buffet constitué de plats marocains et internationaux</strong> 
    Profitez d'un petit déjeuner marocain traditionnel et d'une variété de plats internationaux.</div>
     <img src="image 2.jpg" alt="image 2" style="margin-right: 20px;" />
     <div><strong>Idéal pour les voyageurs seuls comme pour les groupes</strong> 
    Les espaces intérieur et extérieur ainsi que l'agencement flexible constituent un cadre parfait pour les voyageurs seuls comme pour les groupes.</div>
    <img src="image 3.jpg" alt="image 3" style="margin-right: 20px;" />
    <div> <strong>Des plats délicieux dans une atmosphère accueillante</strong> 
    Retrouvez-vous en famille ou entre amis pour profiter de l'atmosphère bienveillante du Saray, que ce soit à l'intérieur ou à l'extérieur.</div>
    <style> </style>
    <div><img src="image 1.jpg" alt="image 1" style="margin-right: 20px;" />
     <img src="image 2.jpg" alt="image 2" style="margin-right: 20px;" />        
    <img src="image 3.jpg" alt="image 3" style="margin-right: 20px;" />
    • Partager sur Facebook
    • Partager sur Twitter
      14 janvier 2021 à 13:48:51

      Bonjour,

      Manque de Politesse

      Votre message ne comporte pas ou peu de formules de politesse (« Bonjour », « Merci », « Au revoir », etc.). Les règles du site exigent que chaque nouveau message comporte un minimum de politesse. Après tout, les gens qui répondent le font gratuitement, sur leur temps libre. Ils méritent bien un minimum de considération, n'est-ce pas ?

      Manque de précisions

      Vous êtes ici sur un forum d'entraide communautaire et non pas sur un forum de demande de service, le but n'est donc pas de fournir une réponse toute faite ou de directement fournir la solution à quiconque viendrait sans la moindre trace. Afin d'obtenir de l'aide et une solution à votre problème, il est fortement recommandé de présenter clairement l'état actuel du problème en nous fournissant :

      • Un descriptif clair et précis du problème
      • La tentative actuelle de résolution que vous avez effectué
      • Le résultat attendu et le résultat actuel
      • Toutes pistes de recherches pouvant aider à la résolution
      • Partager sur Facebook
      • Partager sur Twitter

      Pas d'aide concernant le code par MP, le forum est là pour ça :)

        14 janvier 2021 à 15:20:56

        Bonjour,

        je m'excuse mais je ne suis pas français je suis pauvre en littérature française .

        Veuillez s'il vous plait  indiquer les précisions manquantes.

        Cordialement , votre fan numéro 1.

        au revoir.Merci  en avance.

        -
        Edité par zizop752 14 janvier 2021 à 15:21:28

        • Partager sur Facebook
        • Partager sur Twitter
          14 janvier 2021 à 15:29:15

          Les précisions attendues : quel est le problème ? L'image fournie est visible mais n'aide pas à savoir ce qui ne va pas : quel est le résultat attendu ? Décris-le nous, en texte ou en image, comme tu veux.
          • Partager sur Facebook
          • Partager sur Twitter

          Pas d'aide concernant le code par MP, le forum est là pour ça :)

            14 janvier 2021 à 15:54:11

            rebonjour,

            le problème est que je n'arrive pas à mettre des textes en dessous de quelques photo; chaque texte accompagne son image  . Voilà un aperçu du résultat attendu .

            Merci pour votre aide.

            Au revoir

            • Partager sur Facebook
            • Partager sur Twitter
              14 janvier 2021 à 18:10:13

              Dans ce cas, il faut utiliser ce genre de structure :

              <div>
                  <img>
                  <div>texte</div>
              </div>

              Et ensuite tu places tes éléments.

              Tu as déjà un système de grilles ? Soit Bootstrap par exemple, soit fait maison ? Si non, le plus simple si ton besoin est précisément sur cette page d'avoir 3 éléments de front c'est de mettre chaque groupe (div qui contient image et texte) dans un conteneur avec display: flex; flex-wrap: wrap; et que les enfants (donc les groupes) aient un flex-basis: 33%. Je fais de mémoire, ça n'est pas forcément juste mais ça t'approchera de ce que tu cherches, je pense.

              • Partager sur Facebook
              • Partager sur Twitter

              Pas d'aide concernant le code par MP, le forum est là pour ça :)

                15 janvier 2021 à 12:12:24

                le HTML5 dispose de la structure suivante pour afficher une image et sa légende

                <figure>
                  <img src="image.jpg" alt="une image">
                  <figcaption>Légende de mon image</figcaption>
                </figure>

                Autant l'utiliser.

                • Partager sur Facebook
                • Partager sur Twitter
                  15 janvier 2021 à 12:16:06

                  Excellente suggestion - je n'étais plus sûre de ce qu'on pouvait mettre dans figcaption, donc j'ai évité d'en parler.
                  • Partager sur Facebook
                  • Partager sur Twitter

                  Pas d'aide concernant le code par MP, le forum est là pour ça :)

                    15 janvier 2021 à 12:57:16

                    je dirais même plus, allons plus loin !

                    Que pensez vous de ça, Lamecarlate ? 

                    <section>
                    	
                      <article>
                        <figure>
                          <img src="img/01.jpg" alt="illustration 4X points reward">
                        </figure>
                        <figcaption>
                          Soyons prêt pour la nouveauté
                        </figcaption>
                        <header>
                          <h2>Gagnez 4X plus de points rewards</h2>
                        </header>
                        <p>
                          Le réseau Accor se développe ! À cette occasion, gagnez 4x plus de points Rewards en séjournant         
                          dans l'un de nos hôtel. Découvrez un nouveau monde.
                        </p>	
                      </article>
                    
                      <article>
                          ....
                      </article>
                    
                      <article>
                          ....
                      </article>
                    
                    </section>
                    



                    • Partager sur Facebook
                    • Partager sur Twitter

                    problème de position de texte sous les images

                    × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                    × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                    • Editeur
                    • Markdown