Unwanted spaces between list-items

Question

I have list-items with links inside. Now I want to get rid of the space between the list-items that you can see in the snippet.
(To be correct, it's actually space inside of the list items not between them) Or to be more specific: I actually want a 5px margin between all of the list items but the one that is currently there, wherever it's coming from is not showing in all browsers.
So I need to identify where it's coming from and make it work across all browsers or replace it with a 5px margin.

This is not my code so maybe it's something obvious but I don't see it.

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

li {
  width: 228px;
  margin: auto;  
}

a {
  margin: 0;
  background-color: #c35646;
  position: relative;
  display: inline-block;
  width: 193px;
  padding-left: 35px;
  color: white;
  font: 300 15px 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  line-height: 30px;
  height: 30px;
  text-shadow: 1px 1px 0px rgba(0,0,0,0.2);
  text-align: center;
  border-radius: 3px;
}

span {
    position: absolute;
    top: 0;
    left: 0;
    width: 35px;
    height: 30px;
    box-shadow: inset -1px 0px 0 0 rgba(255,255,255,0.15);
}

<ul>
<li><a><span>TEXT</span></a></li>
<li><a><span>TEXT2</span></a></li>
</ul>