css - Firefox problems with floated span inside <button> -


i have not been able make html5 button span inside of alike in chrome , ff. see link below in ff , in chrome. text "login" verticaly centered in chrome in ff text higher up. line height can not changed in ff buttons.

when try solve problem without using float problem accurs whith line-height , using font-size:30px in span.

check out problem here

oh, , dont want use images..

the firefox issue this: revisiting firefox button line-height bug... 2011 solutions?

you can work around wrapping text inside button in span, , adding line-height that:

<button><span>login</span><span class="a">›</span></button>  button span:first-child {     line-height:35px; } 

see: http://jsbin.com/afezem/2

or, might prefer abuse b element: http://jsbin.com/afezem/4

<button><b>login</b><span>›</span></button> 

Comments

Popular posts from this blog

c# - SharpSVN - How to get the previous revision? -

c++ - Is it possible to compile a VST on linux? -

url - Querystring manipulation of email Address in PHP -