How to align vertically text inside li in css -


i have <li> tag contains img , text, , want align contents of li centered vertically. best way this?

<ul id='menu'>     <li>         <img src='image/logout.png' width='40px' height='40px'>           <a href='index3.php?page=logout'>logout</a>     </li> </ul> 
ul#menu li {     border: 2px solid #000;     border-right: 0;     border-left: 0;     padding: 15px;     height: 50px;     line-height: 50px;     -webkit-border-radius: 0 30px 0 30px;     -moz-border-radius: 0 30px 0 30px;     border-radius: 0 30px 0 30px;      /*shadow*/     -webkit-box-shadow: 0px 6px 0px rgba(0, 0, 0, 0.8);     -moz-box-shadow: 0px 6px 0px rgba(0, 0, 0, 0.8);     box-shadow: 0px 6px 0px rgba(0, 0, 0, 0.8);      /*gradient*/     background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));     background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));     background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));     background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));     background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)); } 

enter image description here

you can add style="vertical-align: middle;" on image tag vertically center text.


Comments

Popular posts from this blog

asp.net mvc - SSO between MVCForum and Umbraco7 -

Python Tkinter keyboard using bind -

ubuntu - Selenium Node Not Connecting to Hub, Not Opening Port -