html - My button becomes misaligned when I wrap it in an <a> tag -


i wondering whether 1 of shed insight on why 1 of buttons becomes misaligned when wrap in <a> tag.

i have

<div class="outerdiv" id="navbar">     <a href="runningcalculator.html"><input type="button" class="navbutton" value="running calculator"/></a>     <input type="button" class="navbutton"/>     <input type="button" class="navbutton"/> </div> 

in body, , first button showing margin @ top while other 2, desired, aren't.

here's css navbutton class:

.navbutton {     width: 150px;     height: 25px;     background-color: rgba(51,51,51,0.5);     margin: 0px;     padding: 0px;     color: #fff;     font-size: 15;     text-shadow: 2px 2px rgb(51,51,51); } 

don't wrap buttons in anchor tags. forbidden html specification , gives inconsistent (and undesirable) results across browsers.

if want functionality of link use link. if want functionality of button use button.

then apply css make whichever element selected way want.


Comments

Popular posts from this blog

android - Get AccessToken using signpost OAuth without opening a browser (Two legged Oauth) -

org.mockito.exceptions.misusing.InvalidUseOfMatchersException: mockito -

google shop client API returns 400 bad request error while adding an item -