I am trying to include an image in the #sidebar-wrapper class using the code below:
CSS:
#sidebar-wrapper {
background-image:url('/images/nav.jpg');
margin-left: -250px;
left: 250px;
width: 250px;
position: fixed;
height: 100%;
overflow-y: auto;
z-index: 1000;
transition: all 0.4s ease 0s;
}
HTML:
<div id="sidebar-wrapper">
<ul class="sidebar-nav" id="MainMenu">
<li class="sidebar-brand"><a href="#">Menu</a>
</li>
<li><a href="#"><img src="images/icons/home.png">HOME</a>
</li>
<li><a href="#">Menu</a>
<ul class="sidebar-brand">
<li><a href="navigation.html">sub menu 1</a></li>
<li><a href="#">sub menu 2</a></li>
<li><a href="#">sub menu 3</a></li>
<li><a href="#">sub menu 4</a></li>
<li><a href="#">sub menu 5</a></li>
<li><a href="#">sub menu 6</a></li>
</ul>
</li>
<li><a href="#">Menu</a>
</li>
<li><a href="#">Menu</a>
</li>
<li><a href="#">Menu</a>
</li>
<li><a href="#">Menu</a>
</li>
<li><a href="#">Menu</a>
</li>
</ul>
</div>
The image is not showing up on the sidebar. I would greatly appreciate any help or guidance on this issue.
Thank you