Entenda a diferença entre elementos que ocupam a linha toda e os que ficam no fluxo do texto
Algumas tags ocupam a largura inteira disponível. Outras ficam apenas no espaço do próprio conteúdo.
É daí que vem a diferença entre elementos block e inline.
Eles normalmente começam em uma nova linha e ocupam toda a largura disponível.
Exemplo:
Carregando...Cada div aparece em sua própria linha.
Eles ficam no fluxo do texto, sem quebrar a linha automaticamente.
Carregando...Carregando...Aqui o span fica junto com o texto, sem criar uma linha nova.
<div>, <p>, <h1>;<span>, <a>, <strong>.Porque esse comportamento afeta diretamente o layout da página. Se uma tag está pulando linha quando não deveria, ou ficando espremida quando você queria um bloco, geralmente o problema começa aqui.