CSS: Nested span tags behave differently when you type differently?

Question

Those 2 blocks of code are the same but when they are output, they look differently. There is a gutter in between each characters on the second one?

<span>A<span>B<span>C</span></span></span>

<span>A
  <span>B
    <span>C</span>
  </span>
</span>

http://codepen.io/vennsoh/pen/ptJwI

Answer 1

It is because of the the inline-block 4px padding that built in your browser. the option to decline this space is to use like you do with out space between the > to < of spans

the other option is to use negative margin left in 4px to each of the element except the first one.

Answer 2

Yes, because enter or '\n' is equal to a space in HTML