0

ej

HTML

 <!-- SHOWCASE -->
<header class="showcase">
  <h2 class="title">X-TOUR</h2>
  <p class="parraph">Ushuaia - Tierra del Fuego Antártida e Islas del Atrlántico Sur</p>
    <div class="slider">
      <ul>
        <li>
          <img src="img/img1.jpg" alt="">
        </li>
        <li>
          <img src="img/img2.jpg" alt="">
        </li>
        <li>
          <img src="img/img3.jpg" alt="">
        </li>
        <li>
          <img src="img/img4.jpg" alt="">
        </li>
      </ul>
    </div>
</header>

CSS

/* SHOWCASE */
.showcase{
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
justify-content: flex-end;
color: #fff;
}

.showcase .title{
position: absolute;
height: 450px;
}

.showcase .parraph{
position: absolute;
height: 400px;
}

.showcase .slider{
overflow: hidden;
height: 100%;
}

.showcase .slider ul{
display: flex;
padding: 0;
width: 400%;
animation: change 16s infinite alternate linear;
}

.showcase .slider li{
width: 100%;
list-style: none;
}

.showcase .slider img{
width: 100%;
height: 700px;

}

Buenas tardes, tengo el problema con el texto que dice "x-tour ushuaia-tierra del.." se sobresale con mi barra lateral, no se que estare haciendo mal, quizas separe mal los contenedores, e intentado de todo pero no puedo solucionarlo, me pueden dar una mano? desde ya muchas gracias! Crei que era tema de la opacidad que le puse y aunque se la quite el texto que esta en el centro de la imagen sigue sobre saliendo la barra lateral..

1
  • no entiendo bien, quieres que es texto quede por debajo de la barra lateral? o quieres que este contenido en la barra lateral? Commented el 29 mar. 2021 a las 3:26

1 respuesta 1

0

Prueba usanto el atributo z-index en tu barra lateral.

Este atributo ordena los elementos en el eje z. A mayor valor de z-index más "arriba", en una capa superior se ubica el elemento. Supongo que quieres que al desplegar el menú ese texto quede por debajo.

En el html que pasaste no se ve el código de la barra lateral y sus estilos asique no puedo ayudarte correctamente.

1
  • Era el z-index, gracias! Commented el 7 jun. 2021 a las 14:50

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.