html - Inline input fields behave differently in browsers -


i have quantity selector on webpage. used trick make them inline without gaps.

<div id="quantitybar">                             <span class="inputwrapper">         <button id="piece_plus">+</button>         <input type="text" value="1" id="pieces" />         <button id="piece_minus">-</button>     </span>     <input type="submit" value="add cart" />                         </div> 

here's fiddle: http://jsfiddle.net/86sz7/

it looks nice in chrome, in firefox bottom border of text imput field missing piece. if set overflow: hidden span looks ok, submit button shifted down. want make same in chrome , firefox. plus: nice have submit button align other inputs too, because it's little off.


Comments

Popular posts from this blog

php - render data via PDO::FETCH_FUNC vs loop -

c# - Why won't my code write to SQL? -

c# - Avoiding duplicate methods for Task and Task<T> -