"Side Menu"
Bootstrap 3.3.0 Snippet by andream80

<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="container"> <div class="row"> <div class="col-md-2 col-sm-2"> <div id="public-image-menu-m"> <ul class="public-image-tag-m"> <li class="public-image-category-a selected">Category <ul> <li class="public-image-tag-a" >Tag</li> </ul> </li> <li class="public-image-category-a" >No Category</li> <li class="public-image-category-a" >Show All Images</li> <li class="public-image-category-a" >Show Untagged Images</li> </ul> </div> </div> </div> </div>
.public-image-tag-m { position: absolute; top: 15px; width: 200px; margin: 0; padding: 0; list-style: none; } .public-image-tag-m li { text-indent: 20px; line-height: 40px; } .public-image-tag-m li a { display: block; text-decoration: none; color: #999999; } .public-image-tag-m li a:hover { cursor: pointer; text-decoration: none; color: #337cb7; background: rgba(211, 211, 211, 0.2); } .public-image-tag-m li a:active, .public-image-tag-m li a:focus { cursor: pointer; text-decoration: none; } .public-image-category-a { list-style: none; text-decoration: none; color: #999999; } .public-image-category-a:hover { cursor: pointer; text-decoration: none; color: #337cb7; background: rgba(211, 211, 211, 0.2); } .public-image-category-a:active, .public-image-category-a:focus { cursor: pointer; text-decoration: none; } .public-image-category-a:first-letter { text-transform: uppercase; } .public-image-tag-a { margin-left: -25px; list-style: none; text-decoration: none; color: #999999; } .public-image-tag-a:hover { cursor: pointer; text-decoration: none; color: #337cb7; background: rgba(211, 211, 211, 0.2); } .public-image-tag-a:active, .public-image-tag-a:focus { cursor: pointer; text-decoration: none; } .public-image-tag-a:first-letter { text-transform: uppercase; } .selected { background: rgba(174,171,172,0.2); li { display: block; } }

Related: See More


Questions / Comments: