problème affichage galerie images

Bonjour,
Ma galerie images en affichage horizontal me pose de gros problèmes quoi que je fasse l'affichage se met en vertical. Les problèmes persistent quel que soit le thème utilisé y compris par celui par défaut, plugins désactivés, Wordpress à jour, aucun conflit de CSS puisque je pars de zéro et n'ai pas modifié le CSS du thème choisi. Je comprends d'autant moins que j'ai testé la galerie d'images avec mon thème en utilisant Wordpress en mode local et que là tout est nickel.
Je ne sais plus où chercher pour régler le problème.
Merci par avance pour votre aide.

".gallery {
  display: flex;
  flex-direction: column; 
  margin-left: 20px; /* Ajoutez la marge à gauche */
  margin-top: 25px;  
}
.row {
  display: flex;
  flex-wrap: wrap;
  margin-left: -40px; /* Compenser la marge ajoutée à .gallery */
}

figure {
  flex: 1 1 auto; /* Les images s'adapteront en largeur */
  margin: 0 18px 0 0; /* Espacement entre les images */
  position: relative;
}

figcaption {
  text-align: left;
}"

"<section class="gallery">
    <div class="row">
      <figure>
        <a href="https://example.com/image1.jpg">
          <img src="https://example.com/image1.jpg">
        </a>
        <figcaption>
          <p>Légende image 1</p>
        </figcaption>
      </figure>
       <figure>
        <a href="https://example.com/image2.jpg">
          <img src="https://example.com/image2.jpg">
        </a>
        <figcaption>
          <p>Légende image 2</p>
        </figcaption>
      </figure>
      <figure>
        <a href="https://example.com/image3.jpg">
          <img src="https://example.com/image3.jpg">
        </a>
        <figcaption>
          <p>Légende image 3</p>
        </figcaption>
      </figure>
</section>"