Navbar

Good looking slim sidebar menu

techadmin3 years ago

2.1kViews

38Downloads

Navbar Bootstrap 5Free+ CSS

Good looking slim sidebar menu: a hand-crafted, open-source Bootstrap 5 navbar. HTML & CSS included, ready to copy.

2.1k views38 downloads3 years ago

gosnippets.com/preview/good-looking-slim-sidebar-menu

Source Code

1<aside>
2  <ul>
3    <li class="menu">Ui kit</li>
4    <li>
5      <i class="fa fa-user-o" aria-hidden="true"></i>
6    </li>
7    <li>
8      <i class="fa fa-laptop" aria-hidden="true"></i>
9    </li>
10    <li>
11      <i class="fa fa-clone" aria-hidden="true"></i>
12    </li>
13    <li>
14      <i class="fa fa-star-o" aria-hidden="true"></i>
15    </li>
16    <li>
17      <i class="fa fa-trash-o" aria-hidden="true"></i>
18    </li>
19  </ul>
20</aside>
21<section class="main">
22  <article class="full">
23    <h2>Ui Kit presentation - full article with icon</h2>
24    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
25    <div>
26    </div>
27  </article>
28  <article class="half">
29    <h2>Ui Kit presentation - half article</h2>
30    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
31  </article>
32    <article class="half active">
33    <h2>Ui Kit presentation - half article active</h2>
34    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
35  </article>
36  <div class="clearfix"></div>
37  <article class="full">
38    <h2>Ui Kit presentation - full article</h2>
39    <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
40  </article>
41  <article class="half active">
42    <h2>Ui Kit presentation</h2>
43    <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
44  </article>
45    <article class="half">
46    <h2>Ui Kit presentation</h2>
47    <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
48  </article>
49</section>
50<aside class="right-sidebar">
51  <article>
52    <p>Article 1</p>
53  </article>
54  <article>
55    <p>Article 2</p>
56  </article>
57</aside>

More Navbar snippets

Responsive Sidebar Navigation for Dashboard

Responsive Sidebar Navigation for Dashboard: a hand-crafted, open-source Bootstrap 5 navbar. HTML & CSS included, ready to copy.

NavbarView →

Bootstrap Transparent navbar example

Bootstrap Transparent navbar example — a free Bootstrap 5 navbar snippet. Copy the HTML, CSS & JS and paste straight into your Bootstrap 5 project.

NavbarView →

Bootstrap 5 e-commerce navigation with product snippet

Bootstrap 5 e-commerce navigation with product snippet: a hand-crafted, open-source Bootstrap 5 navbar. HTML & CSS included, ready to copy.

NavbarView →

Comments(0)

No comments yet — be the first to start the discussion.

Sign in to join the conversation.