Fix button hover from spilling out from the button

Site URL: https://danielleedneyhomes.squarespace.com/

Im trying to fix the hover on my button, currently the hover goes outside the actual button

its in a code block with:

 <div class="button">
   <span style="
border: 2px solid #fff;
border-color: #fff;
border-radius:5px;
padding-right:1.4em;
padding-left:1.4em;
padding-top:.35em;
padding-bottom:.35em;
font-size: 13px;
font-weight: 600;
"> CONTACT </span>
<p>
  

and then in the CSS is  

.button {
  transition-duration: 0.4s;

}

.button:hover {
  background-color: #000; /* Green */
  color: white;
}

it's the contact button at the bottom. 

Thanks!

1 hour ago, skywalker888 said:

Site URL: https://danielleedneyhomes.squarespace.com/

Im trying to fix the hover on my button, currently the hover goes outside the actual button

its in a code block with:

 <div class="button">
   <span style="
border: 2px solid #fff;
border-color: #fff;
border-radius:5px;
padding-right:1.4em;
padding-left:1.4em;
padding-top:.35em;
padding-bottom:.35em;
font-size: 13px;
font-weight: 600;
"> CONTACT </span>
<p>
  

and then in the CSS is  

.button {
  transition-duration: 0.4s;

}

.button:hover {
  background-color: #000; /* Green */
  color: white;
}

 

it's the contact button at the bottom. 

 

Thanks!

 

Can you give the password to access your url?

6 hours ago, HoaLT said:

Can you give the password to access your url?

Hi, 

Yes it's "Homes" thanks!

6 hours ago, skywalker888 said:

Hi, 

Yes it's "Homes" thanks!

I can not find the problem with buttons in your site. Can you take a screenshot the button issue you want to fix?