0

Estoy creando un menú con posicionamiento Fixed-top en un div. Pero al crear otro div para nuevo contenido, este div no sigue el flujo y se posiciona por detras del primer div.He usado la propiedad margin-top la cual funciona en tamaño normal de PC pero al probar en diferente tamaños responsive, igual parte del contenido se posiciona por detrás del primer Div.Por favor ayuda*

<div class="container header fixed-top  p-0">
           
                <!--Row-->
                <div class="row mb-0">
                    <div class="col">
                        <nav class="navbar navbar-expand-lg navbar-light bg-light  justify-content-end">
                           
                            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" arial-controls="navbarNavDropdown" aria-expanded="false" arial-label="Toggle navigation"><span class="navbar-toggler-icon"></span>
                            </button>
                            <div class="collapse navbar-collapse justify-content-center" id="navbarNavDropdown">
                                <ul class="navbar-nav" >
                                    <li class="nav-item ">
                                        <a class="nav-link index" href="#">Inicio</a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" href="#">Nosotros</a>
                                    </li>
                                    <li class="nav-item dropdown" href="#">
                                     <a class="nav-link " href="" id="navbarDropdownMenuLink" data-toggle="dropdown" arial-haspopup="true" arial-expanded="false">Ventas</a>
                                     <ul class="dropdown-menu" arial-labelledby="navbarDropdownMenuLink">
                                        <li><a class="dropdown-item" href="">Venta 1</a></li>
                                        <li><a class="dropdown-item" href="">Venta 2</a></li>
                                        <li><a class="dropdown-item" href="">Venta 3</a></li> 
                                     </ul>   
                                    </li>

                                    <li class="nav-item">
                                        <a class="nav-link" href="#">Noticias</a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" href="#">Contáctanos</a>
                                    </li>                               

                                </ul>
                                
                            </div>
                                        
                        </nav>
                    </div>
                </div>
            </div>



<div class="container slider ">
                <p>PRINCIPIOLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
                cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
                proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
      

            </div>
3
  • Cuando tu colocas algo con pocisionamiento fixed o absolute este contenedor automaticamente se desacopla de la misma linea que siguen los otros elementos, por lo tanto este puede quedarse superpuesto encima de otros o en tu caso queda detras, ademas esto mismo hace que otros elementos puedan ocupar el espacio que el contenedor que esta usando pocisionamiento fijo no esta usando, y si, puedes verlo asi, tecnicamente es como si tuvieras un cubo que puede estar en el mismo espacio que tu y no va a afectar a la materia (a los otros contenedores).
    – Layer
    Commented el 9 ago. 2020 a las 23:09
  • Por eso debes pensar en si realmente necesitas lo de pocisionamiento fixed, yo no he usado bootsrap, uso es css puro, por lo que solo te puedo ayudar describiendote eso.
    – Layer
    Commented el 9 ago. 2020 a las 23:10
  • @Riven Así es el segundo contenedor ocupa el espacio del primer contenedor. Gracias!
    – cc Zero
    Commented el 9 ago. 2020 a las 23:21

0

Tu Respuesta

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

Examina otras preguntas con la etiqueta o formula tu propia pregunta.