Navbar bootstrap hides items but does not show when clicked

Asked

Viewed 207 times

1

The grouping works when I lower the window, it puts all the items in the hidden menu and shows the button with three "-", but when I click the button it does not show the menus that were hidden, it only reappears if I increase the screen again to a size that fits them.

<script src="Scripts/jquery-3.1.1.min.js"></script>
<script src="Scripts/bootstrap.min.js"></script>

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>

<form id="form1" runat="server" class="container">
    <div>

        <nav class="navbar navbar-inverse">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#minhaNavbar" aria-expanded="false" aria-controls="minhaNavbar">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>

                    <a class="navbar-brand" href="#">Meu menu</a>
                </div>

                <div id="minhaNavbar" class="navbar-collapse collapse">
                    <ul class="nav navbar-nav">
                        <li>
                            <a href="#agenda">Teste 1</a>
                        </li>
                        <li>
                            <a href="#consulta">Teste 2</a>
                        </li>
                        <li>
                            <a href="#sair">Sair</a>
                        </li>
                    </ul>

                </div>

            </div>
        </nav>

        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
    </div>

</form>

  • I accidentally solved the problem myself. The problem is that I am using a master page and on the pages added to the master page I did not put this line: <meta name="viewport" content="width=device-width, initial-Scale=1, Maximum-Scale=1" /> After putting this line on the other pages everything is working normally.

  • answer your own question, or delete it.

1 answer

2

I accidentally solved the problem myself. The problem is that I am using a master page and on the pages added to the master page I did not put this line:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" /> 

After putting this line on the other pages is working all normally.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.