Why does this vertical-align:middle fails in Jquery mobile
- by SJ GJ
Am trying to middle a set of icons to the middle of screen, below is the code:
 <div data-role="content" class="ui-content ui-body-a" style="vertical-align: middle" data-theme="a">
        <fieldset class="ui-grid-a icon-set" style="vertical-align: middle"  data-theme="b">
           <div class="ui-block-a center" style="vertical-align: middle">
               <a href="test">
                <div>
                <img src="css/images/test5.png" style="width: 80px;height: 80px"/>
                </div>
                <div>
                    Login
                </div>
                </a>
           </div>
           <div class="ui-block-b center">
                  <a href="#settings" data-transition='slide'>
                    <div>   <img src="css/images/test4.png" style="width: 80px;height: 80px"/></div>
                    <div>Settings</div>
                  </a>
           </div>
             <div class="ui-block-a center">
                  <a href="test">
                    <div>   <img src="css/images/test2.png" style="width: 80px;height: 80px"/></div>
                    <div>Aboutus</div>
                    </a>
              </div>
               <div class="ui-block-b center">
                  <a href="test">
                    <div>   <img src="css/images/test1.png" style="width: 80px;height: 80px"/></div>
                    <div>Contact Us</div>
                    </a>
           </div>
       </fieldset>
        </div>