html - Align <li> with <input> with the text -


i align text , input in li horizontaly aligned menu on left. here how looks.

enter image description here

i need newsletter align menu on left.

css

#footer .div1{     float:left; } #footer ul{     list-style:none; } #footer li{     float:left;     padding-left:20px;     font-size:18px; } #footer li:first-child{     padding-left:0px; } 

html

<div id="footer">   <div class="div1">     <ul>       <li><b>we &hearts; network</b></li>       <li>facebook</li>       <li>blog</li>       <li>contact</li>       <li>newsletter : <input type="text" name="email" id="emailnl" style="font-family:arial; width:200px; margin:0px; padding:0px;"/> <span id="submitnl" style="cursor:pointer">ok</span></li>     </ul>   </div>   <div style="clear:both"></div> </div> 

thanks

image updated!

with padding , margin 0px it's there can notice slight difference. :s

update 2

by changing float:left of li display:inline-block, text align input seems padding-top 2px ... think i'll tweak make fit , see through each browsers.

try reset padding , margin of element , try vertical-align property - http://www.w3schools.com/cssref/pr_pos_vertical-align.asp

although, tested, align is. below preview firefox

li elements align input element , text in html

you can try

#footer ul {     list-style: none outside none;     margin: 0;     overflow: auto;     padding: 0; }  input[type=text]{ padding:0; margin:0; } 

see if works.


Comments

Popular posts from this blog

linux - Using a Cron Job to check if my mod_wsgi / apache server is running and restart -

actionscript 3 - TweenLite does not work with object -

jQuery Ajax Render Fragments OR Whole Page -