title: How to vertically align div inside another div without display:table-cell
body: <p>Ok this is the div structure.</p>
  
  <pre><code>  &lt;div class="DivParent"&gt; 
    &lt;a href="#"&gt;
  
    &lt;div class="DivWhichNeedToBeVerticallyAligned"&gt;&lt;/div&gt;
  
    &lt;/a&gt;    
    &lt;/div&gt;
  </code></pre>
  
  <p>DivParent has fixed width and height values but DivWhichNeedToBeVerticallyAligned does not have fixed height values.</p>
  
  <p>If you make DivParent  display:table-cell; you can vertically align DivWhichNeedToBeVerticallyAligned  but i don't want to use that feature since it causes some mess.</p>
  
  <p>A href tag link should be same size with the divParent i mean whole divparent has to be clickable. like display:block.</p>
  
  <p>So are there any CSS way of vertically aligning or lightweight jquery solution would also help.</p>
  
  <p>Thank you.</p>
  
  <p><strong>Here jsfiddle</strong> : <a href="http://jsfiddle.net/XHK2Z/" rel="noreferrer">http://jsfiddle.net/XHK2Z/</a></p>
  
  <p>*</p>