Estoy trabajando en una página que debe ser responsiva. La cuestión es que tengo un texto dentro de una etiqueta spanspan
y al verlo desde un celular las letras se enciman.
Este es el fragmento del código:
<html>
<body>
<div style="margin:0 auto; max-width: 1000px;">
<div>
<p style="text-align: center;">
<span style="font-size: 36px;">
Este span es un elemento en línea; este fondo se ha coloreado
para mostrar el principio y fin de la influencia del elemento en línea
</span>
</p>
</div>
</div>
</body>
</html>
<div style="margin:0 auto; max-width: 1000px;">
<div>
<p style="text-align: center;">
<span style="font-size: 36px;">
Este span es un elemento en línea; este fondo se ha coloreado
para mostrar el principio y fin de la influencia del elemento en línea
</span>
</p>
</div>
</div>
Me gustaría que me pudieran dar una explicación de por qué sucede esto, de antemano les agradezco su tiempo.