HTML malfunction

[Ro_bert]

Can't figure out why the background isn't applied to the entire button?

 

[BigDady]

Instead of a picture of your editor to show us code use the </> icon above the message area to copy/paste it so we can do the same.

 

[VBService]

Can't figure out why the background isn't applied to the entire button?

in this way

<a href="#" class="button">
  <span>Full Story</span>
</a>

you use <span> and this element is not a block element, it is a non-semantic inline container. For this reason not taking all space available in <a> element.
But you no need use <span> to had an arrow in a button (<a> tag), you can use for this purpose from HTML Entity an arrow char.

[ on-line ]

<a href="#" class="button">
  Full story &rarr;
</a>

.button
{
  height: 3rem;
  display: inline-block;
  padding: 0 2em;
  border-radius: 3rem;
  background-color: #80b7b3;
  -webkit-box-shadow: 0px 5px 1px rgba(0, 0, 0, .5);
  box-shadow: 0px 5px 1px rgba(0, 0, 0, .5);
  font: 400 .95rem/3.4 arial, helvetica, sana-serif;
  color: black; /* #ffffff */
  text-transform: uppercase;
  text-decoration: none;
  letter-spacing: 2.8px;
  transition: all 250ms;
}
.button:hover
{
  background-color: #511e23;
  color: white;
}
.button:active
{
  transform: translatey(3px);
  -webkit-box-shadow: none;
  box-shadow: none;
}

version with ::after

[ on-line ]

<a href="#" class="button">
  Full story
</a>

.button
{
  position: relative;
  height: 3rem;
  display: inline-block;
  padding: 0 2em;
  border-radius: 3rem;
  background-color: #80b7b3;
  -webkit-box-shadow: 0px 5px 1px rgba(0, 0, 0, .5);
  box-shadow: 0px 5px 1px rgba(0, 0, 0, .5);
  font: 400 .95rem/3.4 arial, helvetica, sana-serif;
  color: black; /* #ffffff */
  text-transform: uppercase;
  text-decoration: none;
  letter-spacing: 2.8px;
  transition: all 250ms;
}
.button::after {
  position: absolute;
  right: .5rem;
  top: -.15rem;
  content: '\2192'; /* &rarr */
  font-weight: 900;
  transform: scale(1.3);
}
.button:hover
{
  background-color: #511e23;
  color: white;
}
.button:active
{
  transform: translatey(3px);
  -webkit-box-shadow: none;
  box-shadow: none;
}