Bonjour,

Voila je rencontre un petit problème avec mon code. En effet, lorsque j'ai créé le site internet avec le formulaire, la mise en page était parfaite. J'ai voulu ajouté le code php pour ajouter un captcha et depuis la mise en forme n'est plus la même, en effet les colonnes ne sont plus côte à côté mais l'une sur l'autre.
A votre avis, comment je peux faire pour régler ce problème?

<!-- Contact Section Start -->

<section id="contact" class="section-padding">
  <div class="contact-form">
    <div class="container">
      <h2 class="section-title wow flipInX" data-wow-delay="0.4s"><img src="assets/img/puceondes.gif" alt="puce"> Contact</h2>
      <div class="row contact-form-area wow fadeInUp" data-wow-delay="0.4s">
        <div class="col-md-6 col-lg-6 col-sm-12">
          <div class="contact-block">
            <h3>Vous pouvez nous envoyer un message</h3>

            <form id="contactForm"  method="POST">
              <div class="row">
                <div class="col-md-6">
                  <div class="form-group">
                    <input type="text" class="form-control" id="inputname" name="name" placeholder="nom" required data-error="Merci d'entrer votre nom">
                    <div class="help-block with-errors"></div>
                  </div>
                </div>
                <div class="col-md-6">
                  <div class="form-group">
                    <input type="text" placeholder="Email" id="inputemail" class="form-control" name="email" required data-error="Merci d'entrer votre mail">
                    <div class="help-block with-errors"></div>
                  </div>
                </div>
                 <div class="col-md-12">
                  <div class="form-group">
                    <input type="text" placeholder="Subject" id="inputesubject" name="subject" class="form-control" required data-error="Merci d'entrer votre sujet">
                    <div class="help-block with-errors"></div>
                  </div>
                </div>
                <div class="col-md-12">
                  <div class="form-group">
                    <textarea class="form-control" id="inputmessage" name="message" placeholder="Votre message" rows="5" data-error="Merci d'écrire votre message" required></textarea>
                    <div class="help-block with-errors"></div>
                  </div>
                  </div>
                  <div class="col-md-12">
                    <div class="form-group">
                      <div class="g-recaptcha" data-sitekey="6LeyJYUUAAAAAKp86lmFGuqY8fE41vxA8GnM6rl_"></div>
                    </div>
                    </div>
                  <div class="submit-button">
                    <button class="btn btn-primary" id="submit" type="submit" name="submitpost" VALUE="Envoyer">Envoyer</button>
                    <div id="msgSubmit" class="h3 text-center hidden"></div>
                    <div class="clearfix"></div>
                  </div>

                </div>
              </div>
            </form>
            <?php
            if ($_SERVER['REQUEST_METHOD'] === 'POST') {
                  $key      = '6LeyJYUUAAAAALCwHN7jlTOwfuSXBNZz-r30iYTl';
                  $response = $_POST['g-recaptcha-response'];
                  $ip       = $_SERVER['REMOTE_ADDR'];

                  $gapi = 'https://www.google.com/recaptcha/api/siteverify?secret='.$key.'&response='.$response.'&remoteip='.$ip;
                  $json = json_decode(file_get_contents($gapi), true);

                  if (!$json['success']) {
                      foreach($json['error-codes'] as $error)
                      {
                      echo $error.'<br />';
                      }
                  } else {
                    mail('contact@wifindit.fr', 'Formulaire de contact',  $_POST['email'] . ' ' . $_POST['message'] . ' ' . $_POST['name']. ' ' . $_POST['subject']);
                    header('Location: index.php#contact');
                  }

            }
            ?>

          </div>
        </div>
        <div class="col-md-6 col-lg-6 col-sm-12">
          <div class="footer-right-area wow fadeIn">
            <h2>Contact</h2>
            <div class="footer-right-contact">
              <div class="single-contact">
                <div class="contact-icon">
                  <i class="fa fa-map-marker"></i>
                </div>
                <p>3-5 Rue Albert Marquet 75020 Paris</p>
              </div>
              <div class="single-contact">
                <div class="contact-icon">
                  <i class="fa fa-envelope"></i>
                </div>
                <p><a href="mailto:christian.amoretti@wifindit.fr">christian.amoretti@wifindit.fr</a>
                  <a href="mailto:patrice.drouault@wifindit.fr">patrice.drouault@wifindit.fr</a><br />
                </p>
              </div>
              <div class="single-contact">
                <div class="contact-icon">
                  <i class="fa fa-phone"></i>
                </div>
                <p><a href="#">+33 (0) 1 42 72 50 99</a></p>
              </div>
            </div>
          </div>
        </div>
        <div class="col-md-12">
        <object style="border:0; height: 450px; width: 100%;" data="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2625.023760130011!2d2.4026749152984213!3d48.85775730870593!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47e66d86e136a279%3A0x1782f26beef32f7b!2s3+Rue+Albert+Marquet%2C+75020+Paris!5e0!3m2!1sfr!2sfr!4v1542230696054"></object>
        </div>
      </div>
    </div>
  </div>
</section>
<!-- Contact Section End -->

2 réponses


Bonjour,
Il serai préférable de déplacer ce message dans le bon forum, c'est à dire "HTML/CSS"

vanezou
Auteur

Bonsoir Carouge10,
Je viens de déplacer mon message dans la bonne catégorie.
Bonne soirée!
Vanessa