"google menu"
Bootstrap 3.3.0 Snippet by sumi9xm

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=0.1">
<meta name="author" content="sumit kumar">
<title>Slide Nave</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="css/font-awesome.css" rel="stylesheet" type="text/css">
<link href="css/style.css" rel="stylesheet" type="text/css">
<script src="https://use.fontawesome.com/07b0ce5d10.js"></script>
</head>
<body>
<nav class="navbar navbar-inverse top-nav">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<ul>
<li><a href="#" class="menu-icon" id="btn-menu"><i class="fa fa-bars" aria-hidden="true"></i></a></li>
<li><a href="#" class="brand-logo"><img src="https://lh3.googleusercontent.com/-N4NB2F966TU/WM7V1KYusRI/AAAAAAAADsM/QUIsUhwEVAgj1-fK8mqzAqDiDwEKlKc7QCL0B/w185-d-h40-p-rw/logo.png"></a></li>
</ul>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-left">
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
.top-nav{
width: 100%;
background: #009688;
min-height:50px;
padding: 0 0 0 8px;
overflow: visible;
font-size: 21px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
z-index: 2;
-webkit-box-shadow: 0 1px 8px rgba(0,0,0,.3);
box-shadow: 0 1px 8px rgba(0,0,0,.3);
overflow: hidden;
color: #fff;
position: relative;
border:solid 0px;
border-radius:0px;}
/*FORM SECTION///////////////////////////*/
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
border-color:transparent;
}
.navbar-inverse .navbar-toggle {
border-color: #fff;
margin-top: 12px;
border-radius: 0px;
}
@media (min-width: 768px){
.navbar-form .input-group {
display: inline-table;
vertical-align: middle;
margin-top: 6px;
}
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: