Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
    <!-- Latest compiled and minified CSS -->
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
  <!-- jQuery library -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <!-- Latest compiled JavaScript -->
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
</head>
<body>
<nav class = "navbar navbar-inverse">
                    <div class = "navbar-header">
                        <button type = "button" class = "navbar-toggle" data-toggle = "collapse" data-target = "#mynav">
                            <span class = "icon-bar"></span>
                            <span class = "icon-bar"></span>
                            <span class = "icon-bar"></span>
                        </button>
                        <a href = "#" class = "navbar-brand">Stack Ask</a>
                    </div>
                    
                    <div class = "collapse navbar-collapse" id = "mynav">
                        <ul class = "nav navbar-nav">
                            <li class = "active"><a href = "#">Home</a></li>
                            <li><a href = "#">Education</a></li>
                            <li class = "dropdown"><a class = "dropdown-toggle" data-toggle = "dropdown" href = "#">Tutorials
                            <span class = "caret"></span>
                            </a>
                            <div class = "dropdown-menu">
                                <ul class = "nav navbar-nav">
                                    <li><a href = "#">Programming Languages</a></li>
                                    <li><a href = "#">Web Development</a></li>
                                </ul>
                            </div>
                            </li>
                            <li><a href = "#">Kingdom Centre</a></li>
                            <li><a href = "">About</a></li>
                        </ul>
                        
                        <ul class = "nav navbar-nav navbar-right">
                            <li class = "dropdown"><a href = "#" class = "dropdown-toggle" data-toggle = "dropdown"><span class = "glyphicon glyphicon-search"></span> Search</a>
                            
                            <div class = "dropdown-menu">
                            <ul class = "nav navbar-nav">
                            <li>
                            <form class="form-search">
                            <div class = "container-fluid">
                              <input type="text" class="form-control input-medium search-query" style = "border-radius: 25px;" />
                              <button type="submit" class="btn" style = "margin-top: 10px; margin-left: 5px;">Search</button>
                            </div>
                            </form>
                            </li>
                            </ul>
                            </div>
                            </li>
                            
                            <li><a href = "#"><span class = "glyphicon glyphicon-user"></span> Sign Up</a></li>
                            <li><a href = "#"><span class = "glyphicon glyphicon-log-in"></span></span> Log In</a></li>
                        </ul>
                    </div>
                    
                </nav>
</body>
</html>
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers