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
Post a Comment