Carrosel desalinhado

18 de novembro de 2022 17 respostas Resolvido

Naodeveissaber 18 de novembro de 2022

Eu tenho um carrosel de imagens em html e css e quero centralizar o 3° elemento com translateX porém eu não consigo segue o código abaixo:

Obs: A aplicação é para dispositivos de 710px para baixo e eu quero centralizar de 710 para baixo.

#slide_section{
        width: 100%;
        height: auto;
        padding-bottom: 40px;
    }

    #slide{
        width: 76.06295754026354vw;
        height: auto;
        margin: auto;
    }

    #imgSlide{
        width: 100%;
        height: 300px;
        margin: unset;
        display: flex;
        
        /*Modifica está linha*/
        transform: translateX(calc(-15% - -5vw));
    }

    .slide{
        width: 76.06295754026354vw;
        margin-top: auto;
        margin-bottom: auto;
    }

    .slide img {
        width: 120px;
        height: 210px;
    }

    .slide{
        width: 158px;
        margin-top: auto;
        margin-bottom: auto;
    }

    .slide img{
        width: 158px;
        height: 276px;
    }

<section id="slide_section">       
      <div id="slide">
          <div id="imgSlide">
              <div class="slide" id="img1">
                  img...
              </div>
              <div class="slide" id="img2">
                  img...
              </div>

              <div class="slide" id="img3">
                  img...        
              </div>

              <div class="slide" id="img4">
                  img...
              </div>

              <div class="slide" id="img5">
                  img..
              </div>

              <div class="slide" id="img6">
                  img...
              </div>
          </div>
      </div>
</section>

17 Respostas

Lucas_Camara 23 de nov. de 2022

Vc conseguiria criar um https://jsfiddle.net/ com esse código para gente ver?

Naodeveissaber 23 de nov. de 2022 1 like

Aqui, se estiver amador, é porque é a primeira vez que eu fiz algo neste site.

Lucas_Camara 23 de nov. de 2022

Foi mal, acho que não entendi direito o que vc quer dizer com centralizar o 3° elemento.

Naodeveissaber 23 de nov. de 2022

Deixa o terceiro elemento no centro da exibição

rodriguesabner 24 de nov. de 2022 1 like

vc quer deixar tipo assim?