[RESOLVIDO] problema com a Barra de navegação fixa

editado março 2015 em [CURSO] BOOTSTRAP 2
Estou na aula 13 do  curso do Twitter Bootstrap, porém não consigo utilizar o efeito do conteúdo colapsável...
Se possível peço que verifique o Código e Parabéns pelo conteúdo do canal.
Estou aprendendo muito.
Segue o código:

<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset=utf-8>
<meta name="description" content="Curso Bootestrap"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>Curso Bootestrap</title>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/bootstrap-responsive.css">
<link rel="stylesheet" href="css/estilo.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/jquery-1.7.1.min.js"><\/script>')</script>
<script type="text/javascript" src="js/bootstrap.js"></script>
</head>
<body>
<nav class="navbar navbar-fixed-top navbar-inverse">
<div class="navbar-inner">
<div class="container">
<!--btn navbar essa classe é usada como altenador para o conteudo colapsável-->
<button class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="nav-collapse collapse">
<ul class="nav">
<li class="divider-vertical"><a href="">Link 1</a></li>
<li class="divider-vertical"><a href="">Link 2</a></li>
<li class="divider-vertical"><a href="">Link 3</a></li>
<li class="divider-vertical"><a href="">Link 4</a></li>
<li class="divider-vertical"><a href="">Link 5</a></li>
</ul>
</div>
</div>
</div>
</nav>

Comentários

  • Olá tudo bem? 

    Retire class="divider-vertical" das <li> que tudo volta ao normal. 

    area
    area
    area
    area
    area

    image
  • Olá Emerson tudo bem?
    O erro persiste... Já fiz a instalação/configuração do wamp também e mesmo assim não deu certo

    <!DOCTYPE html>
    <html lang="pt-br">
    <head>
    <meta charset=utf-8>
    <meta name="description" content="Curso Bootestrap"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title>Curso Bootestrap</title>
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/bootstrap-responsive.css">
    <link rel="stylesheet" href="css/estilo.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/jquery-1.7.1.min.js"><\/script>')</script>
    <script type="text/javascript" src="js/bootstrap.js"></script>
    </head>
    <body>
    <nav class="navbar navbar-fixed-top navbar-inverse">
    <div class="navbar-inner">
    <div class="container">
    <a href="#" class="brand">Curso Bootstrap</a>
    <!--btn navbar essa classe é usada como altenador para o conteudo colapsável-->
    <button class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    </button>
    <div class="nav-collapse collapse">
    <ul class="nav">
    <li><a href="">Link 1</a></li>
    <li><a href="">Link 2</a></li>
    <li class="dropdown">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
    Link 3
    <b class="caret"></b>
    </a>
    <ul class="dropdown-menu">
    <li><a>Links internos</a></li>
    <li><a>Links internos</a></li>
    <li><a>Links internos</a></li>
    <li><a>Links internos</a></li>
    <li><a>Links internos</a></li>
    </ul>
    </li>
    <li><a href="">Link 4</a></li>
    <li><a href="">Link 5</a></li>
    </ul>
    <form action="" class="navbar-form pull-right">
    <input type="text" class="span2">
    <button class="btn btn-inverse">Buscar</button>
    </form>
    </div>
    </div>
    </div>
    </nav>
  • Emerson Bom dia !
    Eu refiz as aulas e consegui arrumar. 
    O problema estava com a ligação do JavaScript.
    Pode fechar amigo,pois o problema foi resolvido.
    Muito obrigado pela atenção
  • Ok, Muito Obrigado por entrar em contato!

    area
    area
    area
    area
    area

    image
Este tópico está fechada.