Saltar al contenido

Evite el salto de línea entre elementos html

Solución:

Hay varias formas de evitar saltos de línea en el contenido. Utilizando   es unidireccional y funciona bien entre palabras, pero usarlo entre un elemento vacío y algún texto no tiene un efecto bien definido. Lo mismo se aplicaría al enfoque más lógico y accesible en el que utiliza una imagen como icono.

La alternativa más robusta es utilizar nobr marcado, que no es estándar pero es compatible universalmente y funciona incluso cuando CSS está deshabilitado:

<td><nobr><i class="flag-bfh-ES"></i> +34 666 66 66 66</nobr></td>

(Puede, pero no es necesario, usar &nbsp; en lugar de espacios en este caso.)

Otra forma es la nowrap atributo (en desuso / obsoleto, pero sigue funcionando bien, excepto por algunas peculiaridades raras):

<td nowrap><i class="flag-bfh-ES"></i> +34 666 66 66 66</td>

Luego está la forma CSS, que funciona en navegadores habilitados para CSS y necesita un poco más de código:

<style>
.nobr { white-space: nowrap }
</style>
...
<td class=nobr><i class="flag-bfh-ES"></i> +34 666 66 66 66</td>

CSS para ese td: white-space: nowrap; debería resolverlo.

Si necesita esto para varias palabras o elementos, pero no puede aplicarlo a un TD completo o similar, se puede usar la etiqueta Span.

<span style="white-space: nowrap">Text to break together</span>
    or 
<span class=nobr>Text to break together</span>

Si usa la versión de la clase, recuerde configurar el CSS como se detalla en la respuesta aceptada.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *