Superposition des div

bonjour , je voudrais faire un menu avec css et html dont j'ai des images et pour chaque image une image de background au dessous comme ombre (image) et un texte, ma problème est comment positionner ces éléments dans un seul div qui contient d'autres div. merci de m'aider :)
voila mon code:

 <div class="categorie">
  
  <ul>
   <li><div class="omb"> <img src="images/tel.png" /></div> <br /> Téléphone</li>
   <li> <div class="omb"><img src="images/tab.png" /></div><br />Tablette</li>
   <li><div class="omb"> <img src="images/bl.png" /></div><br />Bleutooth</li>
   <li><div class="omb"> <img src="images/mp3.png" /></div><br />Kit mp3</li>
   <li><div class="omb"> <img src="images/jeu.png" /></div><br/>Console jeu</li>

  </ul>

 
 </div>

.categorie{
 height:50px;
 width:800px;
 float:right;
 margin-top:10px;
 margin-left:5px;
 margin-bottom:10px;
 margin-right:0px;
 padding-bottom:20px;
 padding-left:1px;
 padding-right:0px;
 padding-top:0px;
 
}
.categorie li{
 float:left;
 color:#94796e;
 list-style:none;
 font-size:20px;
 padding:10px;
 font-family:gulim;
 text-align:center;
}
.omb{
  background:url(images/ombre1.png) no-repeat;
  width:15px;
  height:15px;
 
 
   background-position: bottom;
  
}