espaciado de bordes

border-spacing solo se aplica a las celdas de la tabla. Si desea usar su span con esa propiedad de estilo específica, debe configurar su visualización principal en table y el span en sí mismo en table-cell .

 div{ border-spacing: 10px; display: table } span{ border: 1px solid red; display: table-cell }

 <div> <span>a</span> <span>b</span> </div>

margen

Otra forma sería agregar un margin . Sin embargo, tenga en cuenta el exceso de margen en el último elemento, que puede no ser siempre el deseado.

 .spacer{ border: 1px solid gray; margin-right: 20px; } /*REM: Remove margin on last element*/ .spacer:last-of-type{ margin-right: 0 }

 <span class = 'spacer'>a</span> <span class = 'spacer'>b</span> <b>c</b>

border-spacing solo establece la distancia entre los bordes de las celdas adyacentes en un archivo . ¡No tienes una mesa aquí, por lo que el comando no funciona! Necesitas configurar el relleno. En tu caso: padding: 10px;

Puedes usar margin en su lugar

 .space { border: 1px solid gray; margin: 0 5px 0 0; }