"Status Box"
Bootstrap 3.2.0 Snippet by ryanmcdonough

<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.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 ----------> <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> <div class="container"> <div class="row"> <div class="col-md-4"> <div class="panel panel-default"> <div class="panel-body"> <input type="email" class="form-control" placeholder="What are you up to?"> </div> <div class="panel-footer"> <div class="btn-group"> <button type="button" class="btn btn-link btn-icon"><i class="fa fa-map-marker"></i></button> <button type="button" class="btn btn-link btn-icon"><i class="fa fa-users"></i></button> <button type="button" class="btn btn-link btn-icon"><i class="fa fa-camera"></i></button> <button type="button" class="btn btn-link btn-icon"><i class="fa fa-video-camera"></i></button> </div> <div class="pull-right"> <button type="button" class="btn btn-success">Post</button> </div> </div> </div> </div> </div> </div>
.panel { -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; margin-bottom: 30px; margin-top:10px; } .panel.panel-default { border: 1px solid #d4d4d4; -webkit-box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.1); } .btn-icon { color: #484848; }

Related: See More


Questions / Comments: