html - CSS Button Borders Not Working In Chrome -


i have simple website, contains button link styled css.

<div id="contact_button">     <a href="mailto:contact@fakemail.com" class="button">contact</a> </div> 

the border displays fine on ie , firefox, not displaying on chrome (mobile or desktop). thoughts?

a.button {   -webkit-appearance: button;   -moz-appearance: button;   appearance: button;    -webkit-transition-duration: 0.4s; /* safari */   transition-duration: 0.4s;    margin: 0 auto;   width: 143px;   display: block;    background-color: #fff; /* white */   border: 2px solid black;   color: #000;   padding: 15px 32px;   text-align: center;   text-decoration: none;   font-size: 16px; }  a.button:hover {   background-color: #000; /* black */   color: white; } 

removing style -webkit-appearance: button; selector a.button, see same output (white background , 2px-width black border) both in chrome , in firefox.


Comments

Popular posts from this blog

Delphi XE2 Indy10 udp client-server interchange using SendBuffer-ReceiveBuffer -

Qt ActiveX WMI QAxBase::dynamicCallHelper: ItemIndex(int): No such property in -

Enable autocomplete or intellisense in Atom editor for PHP -