html - Anchor image and text height not correct -



html - Anchor image and text height not correct -

i trying create tab internal text , image link. problem facing anchor dimensions and/or positioning seem different image. can see in jsfiddle link, there spacing between bottom of image , bottom of div , can't figure out why there.

jsfiddle link

if can't access link, html code:

<div id="sapdatabtn"> <a href="#"> <img runat="server" src="http://i.cubeupload.com/tm2tpf.png" /> </a> <a href="#" id="sapbtntext"> info </a> </div>

css:

#sapdatabtn { background-color: #c7ddf2; text-align: center; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; padding-left: 15px; padding-right: 15px; width: 90px; } #sapdatabtn a:link, #sapdatabtn a:visited, #sapdatabtn a:hover, #sapdatabtn a:active { font-size: 15px; font-weight: bold; color: #19456e; text-decoration: none; } #sapdatabtn img { border-style: none; }

add vertical-align:bottom; in #sapdatabtn img, should trick :)

html css positioning

Comments

Popular posts from this blog

web services - java.lang.NoClassDefFoundError: Could not initialize class net.sf.cglib.proxy.Enhancer -

Accessing MATLAB's unicode strings from C -

javascript - mongodb won't find my schema method in nested container -