0

Estoy desarrollando una página web y estoy utilizando elementos de Bootstrap. Mi problema es que yo he creado mi propia barra de navegación en vez de cogerla de Bootstrap, y el problema es que cuando yo cojo otro elemento de Bootstrap como un carrusel, se me superpone a mi barra de navegación. Quería saber si había alguna propiedad de CSS o alguna otra manera. Muchas gracias de antemano.

2
  • Edita tu pregunta y agrega un ejemplo mínimo verificable de lo que tienes hasta el momento.
    – padaleiana
    Commented el 28 mar. 2021 a las 0:33
  • Invierte el orden en que cargan las librerías en el head de tu html, la que hagas tú siempre debe cargar la última, además debes tener cuidado con los nombres de las clases para tratar de no coincidir con las del framework a menos que lo q quieras sea sobreescribirlas.
    – JorgeGuz
    Commented el 4 abr. 2021 a las 6:18

1 respuesta 1

0

Es una buena idea compartir código en CodeSandbox o Codepen, o un sitio web publicado, para que podamos ver el problema para confirmar, pero probablemente sea un problema de z-index.

Normalmente si algo está encima de otros elementos—en este caso, los elementos Bootstrap—es porque tiene position: relative o position: absolute, y una de las condiciones siguientes:

  • aparecen en el DOM después de sus elementos, o:
  • tiene z-index: <numero> donde el número está más grande que el z-index de los otros elementos debajo de ello

Si los otros elementos no tienen z-index, tiene prioridad normal. Los que tienen z-index tienen más prioridad que los otros, entonces aunque aparecen antes de elementos en el DOM, van a tener más prioridad y se van a poner encima de otros elementos.

Entonces, para solucionar eso, tienes que buscar el z-index de los elementos encima de sus propios elementos. Por ejemplo, sea que el z-index es 100. Puede cambiar el z-index de la navegación a 110 para que sea más grande que los elementos de Bootstrap.

Es mejor aumentar el z-index por 10 y no 1 en caso de que quieres introducir otro elemento entre ellos.

En el código de Bootstrap carousel, veo que elementos tienen z-index: 1 o z-index: 2, entonces no es necesario aumentar por mucho. Puedes poner 10, por ejemplo, y sería suficiente.

2
  • Muchísimas gracias, era eso. Perdón por las molestias:) Commented el 14 abr. 2021 a las 11:06
  • 1
    @PabloBernabeu si la respuesta fue útil por favor márcala "aceptada"
    – Tina
    Commented el 16 abr. 2021 a las 1:43

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.