"Menus after "|""
Bootstrap 3.3.0 Snippet by selvasekhar

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<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">
<ul class="lists">
<li><a href="#">Bulk In Order</a></li>
<li><a href="#">Track Your Order</a></li>
<li><a href="#">Help / Chat</a></li>
<li><a href="#">Login / Register</a></li>
</ul>
</div>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
ul.lists { text-align:right; }
ul.lists li { display:inline-block; list-style:none; }
ul.lists li a { color:#000; font-size:13px; }
ul.lists li a:hover { text-decoration:none; color:#1792eb; }
ul.lists li:after { content:'|'; font-size:20px; color:#596c72; padding:0 10px; }
ul.lists li:last-child:after { content: ""; }
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: