title: CSS layers, Title comes under Image layer
body: <p>I've written html code that includes style sheet. <strong>Image</strong>, <strong>Title</strong> comes under on class and i want to display <strong>Image</strong> on top of the <strong>Title</strong>.. now its comes below the  <strong>Image</strong> layer. and also the <strong>Title</strong> doesn't fit inside data-layer. Help me..
  Here is the html code:</p>
  
  <pre><code>&lt;div id="layout-panel"&gt;
          &lt;div id="tile-container"&gt;
              &lt;div id="tiles-panel" data-bind="foreach: data"&gt;
                  &lt;div class='row-horizontal-tile'&gt;
                      &lt;div class='data-layer'&gt;
                          &lt;div&gt;&lt;img data-bind="attr:{src:ImageUrl}" class="stick-image"/&gt;&lt;/div&gt;                              
                          &lt;div class='text-title' data-bind="text: Title"&gt;
                          &lt;/div&gt;                 
                      &lt;/div&gt;                        
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>css for the above html code is given below:</p>
  
  <pre><code>.row-horizontal-tile
  {         
      margin:10px 5px 8px 1%; 
      width: 23%;
      height: 90%;
      display: inline-block;   
  }
  .data-layer
  {    
      color:#ffffff;    
      font-family:Calibri;        
      text-align:inherit;     
      color:Black; 
      background-color: white;
      height: 100%;
      width:100%;
      border-width: 3px;
      border-style:outset;     
  } 
  .stick-image
  {    
      height: 100%;
      width:100%;  
      background-color: white;
  }    
  .text-title
  {   
      font-family: DokChampa;
      font-size: large;
      text-align:center;
  }
  #layout-panel
  {
      background-color: #444444;
      width: 100%;
      height: 70%; 
  }
  #tile-container
  {
      height: 80%;
      width: 90%;
      background-color:#CCCCCC;
      position:relative;    
      top: 10%;  
      left: 5%; 
  }
  #tiles-panel
  {   
      height: 100%; 
      white-space:nowrap;
      overflow-x:hidden;  
      overflow-y:hidden; 
  }
  </code></pre>
  
  <p>Thanks in advance..</p>