Bootstrap Snippet Input-group using HTML CSS

1
2
3
4
5
6
7
8
9
10
11
12
<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='input-group stylish-input-group' id='search-container'>
                <span class='input-group-addon'>
                    <i class='glyphicon glyphicon-search'></i>
                </span>
                <input id='search-stations' name='search-stations' class='form-control no-rounded-corners' type='text' placeholder='wpisz czego szukasz' autocomplete='no'>
            </div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
#search-container{padding:20px}
.stylish-input-group .input-group-addon{
    background: white !important;
}
.stylish-input-group .form-control{
    border-left:0;
    box-shadow:0 0 0;
}
.stylish-input-group button{
    border:0;
    background:transparent;
}
.no-rounded-corners{border-radius:                    0px;
                    -webkit-border-radius:            0px;
                    -moz-border-radius:               0px;}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"Input-group"
Bootstrap 3.3.0 Snippet by ytre

Related: See More

Questions / Comments:

"Input-group" Bootstrap 3.3.0 Snippet by ytre

Related: See More

Questions / Comments:

"Input-group"
Bootstrap 3.3.0 Snippet by ytre