0

Cada vez que activo el modal, la barra de menús se sale de la pantalla junto con el modal y por ende la barra de menú me oculta el titulo del modal y el principio del contenido, vean:

introducir la descripción de la imagen aquí

HTML de la barra de menu

<div id="navigation">
        <nav class="navbar navbar-custom" role="navigation">
            <div class="container">
                <div class="row">
                    <div class="col-md-2">
                        <div class="site-logo">
                            <a href="index.html" class="brand">
                                <img src="img/archivo-synergy-curva.png" style="height: 50px;">
                            </a>
                        </div>
                    </div>                                         

                    <div class="col-md-10">
                        <!-- Brand and toggle get grouped for better mobile display -->
                        <div class="navbar-header">
                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#menu">
                                <i class="fa fa-bars"></i>
                            </button>
                        </div>
                        <!-- Collect the nav links, forms, and other content for toggling -->
                        <div class="collapse navbar-collapse" id="menu">
                            <ul class="nav navbar-nav navbar-right" id="ejm2">
                                <li class="active"><a href="#intro">Inicio</a></li>
                                <li><a href="#about">Nuestra Empresa</a></li>
                                <li><a href="#service">Misión y Visión</a></li>
                                <li><a href="#works">Portafolio TIC</a></li>
                                <li><a href="#clientes">Nuestros Clientes</a></li>                                                                                
                                <li><a href="#partner">Nuestros Aliados</a></li>
                                <li><a href="#contact">Contactenos</a></li>
                            </ul>
                        </div>
                        <!-- /.Navbar-collapse -->                             
                    </div>
                </div>
            </div>
                          <!-- /.container -->
        </nav>
    </div> 

CSS principal de la barra de navegacion:

#navigation {
background: #fff;
z-index: 9999;
width:100%;
box-sizing:border-box;
border-bottom: 1px solid orangered;

}

1
  • Creo que el problema que tienes es que la modal al igual que el menu superior pueden tener el mismo z-index, o en su caso, la modal esta dentro de un div diferente a donde esta el menu principal. Puedes añadir el codigo html de tu modal con tu menú? Commented el 18 jun. 2018 a las 15:24

1 respuesta 1

1

sin codigo es dificil ayudar pero intenta sobreponer un valor al modal superior a todo con un z index ejemplo

//suponiendo que este sea el div de el modal 
#modal{z-index:3000;}

suponiendo que este sea el div de la barra de navegacion le das un valor menor 
#navbar{z-index:2000;}
3
  • Gracias por la ayuda @andy gibbs Commented el 18 jun. 2018 a las 16:01
  • por nada para eso estamos @LeonardJusaOckonell si te sirvio el codigo recuerda marcar le respuesta como valida
    – andy gibbs
    Commented el 18 jun. 2018 a las 16:05
  • Yo también tengo ese mismo problema, pero con el z-index no lo he resuelto.
    – Miguel
    Commented el 5 mar. a las 19:20

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.