Как уменьшить расстояние между span?
Между инлайновыми элементами всегда есть небольшой отступ. 
Если нужно от него избавиться, 
а) используют отрицательный margin
span {
 margin-left: -4px; 
} 
б) переопределяют контекст
p {
 display: flex;
}
Задать 
p {
  display: flex;
}

А почему у вас запятая в отдельном span-е?