jquery - Bootstrap | Navigation Bar | not working | not compiling classes - 


<nav class="navbar navbar-default">   <div class="container-fluid">     <!-- brand , toggle grouped better mobile display -->     <div class="navbar-header">       <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">         <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="#">brand</a>     </div>      <!-- collect nav links, forms, , other content toggling -->     <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">       <ul class="nav navbar-nav">         <li class="active"><a href="#">link <span class="sr-only">(current)</span></a></li>         <li><a href="#">link</a></li>         <li class="dropdown">           <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">dropdown <span class="caret"></span></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 role="separator" class="divider"></li>             <li><a href="#">separated link</a></li>             <li role="separator" class="divider"></li>             <li><a href="#">one more separated link</a></li>           </ul>         </li>       </ul>       <form class="navbar-form navbar-left">         <div class="form-group">           <input type="text" class="form-control" placeholder="search">         </div>         <button type="submit" class="btn btn-default">submit</button>       </form>       <ul class="nav navbar-nav navbar-right">         <li><a href="#">link</a></li>         <li class="dropdown">           <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">dropdown <span class="caret"></span></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 role="separator" class="divider"></li>             <li><a href="#">separated link</a></li>           </ul>         </li>       </ul>     </div><!-- /.navbar-collapse -->   </div><!-- /.container-fluid --> </nav>

i have copied code https://getbootstrap.com/components/#navbar , putted links bootstrap css, , js file , jquery file too, , have downloaded latest version of bootstrap (4.0.0)

i don't know problem .

the code copied bootstrap v3.3.7, have v4.0.0 alpha installed. many of calsses in 4.0.0 have changed.

you can either download current v3.3.7 of bootstrap code work, or @ navbar documentation bootstrap v4.

something similar have v4 be

<nav class="navbar navbar-toggleable-md navbar-light bg-faded">   <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarsupportedcontent" aria-controls="navbarsupportedcontent" aria-expanded="false" aria-label="toggle navigation">     <span class="navbar-toggler-icon"></span>   </button>   <a class="navbar-brand" href="#">navbar</a>    <div class="collapse navbar-collapse" id="navbarsupportedcontent">     <ul class="navbar-nav mr-auto">       <li class="nav-item active">         <a class="nav-link" href="#">home <span class="sr-only">(current)</span></a>       </li>       <li class="nav-item">         <a class="nav-link" href="#">link</a>       </li>       <li class="nav-item">         <a class="nav-link disabled" href="#">disabled</a>       </li>       <li class="nav-item dropdown">         <a class="nav-link dropdown-toggle" href="http://example.com" id="navbardropdownmenulink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">           dropdown link         </a>         <div class="dropdown-menu" aria-labelledby="navbardropdownmenulink">           <a class="dropdown-item" href="#">action</a>           <a class="dropdown-item" href="#">another action</a>           <a class="dropdown-item" href="#">something else here</a>         </div>       </li>     </ul>     <form class="form-inline my-2 my-lg-0">       <input class="form-control mr-sm-2" type="text" placeholder="search">       <button class="btn btn-outline-success my-2 my-sm-0" type="submit">search</button>     </form>   </div> </nav>

Comments

Post a Comment

Popular posts from this blog

php - Vagrant up error - Uncaught Reflection Exception: Class DOMDocument does not exist -

i've set bento/ubuntu-16.04 vagrant box using php 5.6, , getting following error quite few times when try , run shell script: "uncaught reflection exception: class domdocument not exist". i've tried adding following top of script (not together), each no success: "sudo apt-get install php5.6-xml", "sudo apt-get install php5-xml", "sudo apt-get install php-dom" i've tried resetting server "sudo service apache2 restart". does have suggestions?
Read more

vue.js - Create hooks for automated testing -

Image
qa guys complained can't automate frontend testing. because our html looks same outside. lazy hack did this <template> <div :role="$options.name"> ... </div> </template> <script> export default { name: 'vmcomponentname' } </script> which takes name script , applies html. in browser get: <div role="vmcomponentname"> ... </div> line :role="$options.name" goes in every component. is there dry er solutions? please share. additional details i'll explain in details looking for. imagine have vmusercreate form creates user. test case can create user . to automatically test without role, have use following selector: .wrapper > .wrapper > .wrapper > .submit-button the test extremely brittle (will break lot). if use roles can use [role="vmusercreateform"] .submit-button selector. many folds less brittle. so basically, i'm ...
Read more

Add new key value to json node in java -

i have json file : { "id":1, "name":"abc", "addressdetails": { "city":"newyork" } } i wanted add 1 more key-value ("pincode" : "414141") node 'addressdetails'. i tried using : objectmapper mapper = new objectmapper(); jsonnode root = mapper.readtree(new file("d://test.json")); objectnode node = mapper.createobjectnode(); node.with("addressdetails").put("pincode", "414141"); but it's not getting added, there way can ? you can try you should modify file path objectmapper mapper = new objectmapper(); objectnode nodes = mapper.readvalue(new file("d:\\test.txt"), objectnode.class); nodes.with("addressdetails").put("pincode", "414141"); mapper.writer().writevalue(new file("d:\\test.txt"), nodes);
Read more