title: HTML5 and CSS 3 - Div text Vertical Align Middle
body: <p>Please help,</p>
  
  <p>i want to align the header menu/nav links to vertically align. See:</p>
  
  <p><a href="http://hyindia.com/demo/myoffshore/index.html" rel="nofollow">http://hyindia.com/demo/myoffshore/index.html</a></p>
  
  <p>See the CODE here:</p>
  
  <pre><code>nav ul { list-style-type:none; padding:0px; margin:0px; float:left; width:100%;}
  nav ul li { float:left; width:119px; height:66px;}
  nav ul li a { 
   float:left;
   width:119px;
   height:66px;
   font:bold 15px 'Myriad Pro';
   color:#fff;
   text-shadow:1px 1px #1f1f1f;
   text-align:center;
  }
  
  &lt;nav&gt;
  &lt;ul&gt;
      &lt;li&gt;&lt;a href="#" class="nav1"&gt;HOME&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" class="nav2"&gt;HEALTH INSURANCE&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" class="nav3"&gt;LIFE INSURANCE&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" class="nav4"&gt;OVERSEAS MORTGAGES&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" class="nav5"&gt;ESTATE PLANNING&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" class="nav6"&gt;BANKING&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" class="nav7"&gt;WEALTH MANAGEMENT&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" class="nav8"&gt;QROPS&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p></p>