Question

Hola que tal, tengo un inconveniente con el navbar en mi proyecto, estoy usando bootstrap.
Bueno, cuando minimizo mi página web, el menú se hace pequeño y aparece el botón para desplegar el menú, lo presiono y si despliega pero cuando lo vuelvo a presionar no regresa el menú a su forma normal.

este es mi código me podrían ayudar por favor.

<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
                        <div class="navbar-header">
                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-inverse-collapse">
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                            </button>
                            <a class="navbar-brand" href="#">Brand</a>
                        </div>
                        <div class="navbar-collapse collapse navbar-inverse-collapse">
                            <ul class="nav navbar-nav">
                                <li class="active"><a href="#">Active</a></li>
                                <li><a href="#">Link</a></li>
                                <li class="dropdown">
                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
                                    <ul class="dropdown-menu">
                                        <li><a href="#">Action</a></li>
                                        <li><a href="#">Another action</a></li>
                                        <li><a href="#">Something else here</a></li>
                                        <li class="divider"></li>
                                        <li class="dropdown-header">Dropdown header</li>
                                        <li><a href="#">Separated link</a></li>
                                        <li><a href="#">One more separated link</a></li>
                                    </ul>
                                </li>
                            </ul>

                            <ul class="nav navbar-nav navbar-right">
                                <li><a href="#">Link</a></li>
                                <li class="dropdown">
                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
                                    <ul class="dropdown-menu">
                                        <li><a href="#">Action</a></li>
                                        <li><a href="#">Another action</a></li>
                                        <li><a href="#">Something else here</a></li>
                                        <li class="divider"></li>
                                        <li><a href="#">Separated link</a></li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>

Comments

Buenas. Edita el código que has puesto. Solo has puesto dos </div>

---

A ver si se pasa por aquí @Peter ya que el texto de tu pregunta se está interpretando como código en lugar de mostrarse correctamente y se muestra una barra en la parte superior de la página.

---

Gracias Carlos!

@hanna10 solo tienes que utilizar el icono { } para darle formato al código al hacer las preguntas y puedes editarlas también para corregirlas.

Saludos.

---

lo siento, soy nueva en esto y no me di cuenta.
Gracias.

Answer 1

Hola, estoy viendo el código y veo que acá:

data-target=".navbar-inverse-collapse"

Lo mandas hacia una clase (.navbar-inverse-collapse) de css, y en la documentación de Bootstrap, llaman a un ID (#bs-example-navbar-collapse-1):

data-target="#bs-example-navbar-collapse-1"

No se si implique porque estas usando una clase y no se si el código en realidad prefiere usar un ID. Lo que puedes hacer es agregar un ID a esta linea de código:

<div class="navbar-collapse collapse navbar-inverse-collapse" id="id-aqui">

Y tu data-target quedaría así:

data-target="#id-aqui"

Saludos.