Bootstrap Snippet Modal Login Form With Navbar using HTML CSS Bootstrap

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 ---------->
<div class="blue-bg-nav">
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <header class="header-tp">
                            <nav class="navbar navbar-default navbar-static-top">
                                <div class="container">
                                    <div class="navbar-header">
                                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                                    <span class="sr-only">Toggle navigation</span>
                                    <span class="icon-bar"></span>
                                    <span class="icon-bar"></span>
                                    <span class="icon-bar"></span>
                                    </button>
                                 
                                </div>  
                                    <div id="navbar" class="navbar-collapse collapse">
                                        <form class="form-inline">
                                            
                                        
                                            <a  href="#" class="btn-blu mrgn-top" data-toggle="modal" data-target="#at-helping">Help</a> 
                                            <ul class="nav navbar-nav navbar-right bdr">
                                                <li><a href="#" data-toggle="modal" data-target="#at-login">Sign in</a></li>
                                                
                                                <li ><a href="#" data-toggle="modal" data-target="#at-signup">Sign Up</a></li>
                                            </ul>
                                        </form>
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
.header-tp .navbar {
    position: relative;
    min-height: 50px;
    margin-bottom: 0px;
    border: 1px solid transparent;
}
.header-tp .navbar-default {
    background-color: #1DB9EC;
    border-color:transparent!important;
}
.header-tp .bdr li:nth-child(odd) 
{
    border-left: 1px solid rgba(255, 255, 255, 0.44);
}
.header-tp .bdr li:nth-child(even) 
{
    border-right: 1px solid rgba(255, 255, 255, 0.44);
    border-left: 1px solid rgba(255, 255, 255, 0.44);
}
.header-tp .bdr li
{
    padding:10px 0px;
}
.header-tp .bdr li a
{
    color:#fff!important;
}
.header-tp .pddr
{
    padding-top:5px;
}
.header-tp .navbar-right {
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"Modal Login Form With Navbar"
Bootstrap 3.3.0 Snippet by AtulSunilCalicut

Related: See More

Questions / Comments:

"Modal Login Form With Navbar" Bootstrap 3.3.0 Snippet by AtulSunilCalicut

Related: See More

Questions / Comments:

"Modal Login Form With Navbar"
Bootstrap 3.3.0 Snippet by AtulSunilCalicut