Elementos en BLOQUE vs EN LÍNEA

1. Elementos en BLOQUE

Ocupan todo el ancho disponible y empiezan en una línea nueva. Ejemplos: <div>, <p>, <h1>, <ul>, <li>

Soy un P (bloque)

2. Elementos EN LÍNEA

Solo ocupan el ancho de su contenido y se colocan uno al lado del otro. Ejemplos: <span>, <a>, <strong>, <em>

3. Comparación directa

4. inline-block (híbrido)

Se colocan en línea como los inline, pero aceptan width y height como los bloque.