5027 sujets

Sémantique web et HTML

Bonjour,

Je suis en train d'intégrer un carrousel flickity à mon wordpress mais je rencontre un bug
d'affichage depuis hier. Les deux premières images se chargent complètement mais lorsque j'ajoute + de deux images, les images ajouté de s'affiche pas..

Voici mon code :

<div class="gallery js-flickity" data-flickity-options='{ "pageDots": false, "autoPlay": true, "contain": true, "prevNextButtons": false}'>
            
<div class="carousel-cell"><img src="http://ingenieurie.patrimoine.local/wp-content/uploads/2018/11/3710.jpg">
                <div class="contenteTextSlider">
                    <div class="textSlider1">
                        <span>
                            <h1>Altesse Patrimoine</h1>Ingénierie Patrimoniale et Stratégie Financière<br><a class="linkSlider" href="#">en savoir plus <i class="fas fa-long-arrow-alt-right"></i></a>
                        </span>
                    </div>
                </div>
            </div>

<div class="carousel-cell"><img src="http://ingenieurie.patrimoine.local/wp-content/uploads/2018/11/3710.jpg">
                <div class="contenteTextSlider">
                    <div class="textSlider1">
                        <span>
                            <h1>Altesse Patrimoine</h1>Ingénierie Patrimoniale et Stratégie Financière<br><a class="linkSlider" href="#">en savoir plus <i class="fas fa-long-arrow-alt-right"></i></a>
                        </span>
                    </div>
                </div>
            </div>
          
<div class="carousel-cell"><img src="http://ingenieurie.patrimoine.local/wp-content/uploads/2018/11/704-1.jpg">
                <div class="contenteTextSlider">
                    <div class="textSlider1">
                        <span>
                            <h1>Altesse Patrimoine</h1>Ingénierie Patrimoniale et Stratégie Financière<br><a class="linkSlider" href="#">en
                                savoir plus <i class="fas fa-long-arrow-alt-right"></i></a>
                        </span>
                    </div>
                </div>
            </div>        
 </div>



<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">

<link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css">
<script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>



.contenteTextSlider{
    background-color: #2c3e50c7;
    position: absolute;
    bottom: 4px;
    height: 619px;
    left: 115px;
}

h1 {
    margin-bottom: 6px;
}

.textSlider1{
    color: white;
    font-size: 20px;
    margin-top: 68%;
    padding: 0 20px 0 20px;
    font-family: sans-serif;
}

.linkSlider{
    text-decoration: none;
    color: white;
    font-weight: 100;
    font-family: sans-serif;
}


Merci d'avance pour votre aide ! Smiley smile