Pregunta HTML span alinea el centro no funciona?


Tengo algo de HTML:

<div align="center" style="border:1px solid red">
This is some text in a div element!
</div>

La div está cambiando el espacio en mi documento, por lo que quiero usar un lapso para esto.

Pero span no está centralizando los contenidos:

<span style="border:1px solid red;align=center">
This is some text in a div element!
</span>

¿Cómo puedo solucionar esto?

EDITAR:

Mi código completo:

<html>
<body>

<p>This is a paragraph. This text has no alignment specified.</p>

<span style="border:1px solid red;text-align=center">
  This is some text in a div element!
</span>

</body>
</html>

75
2017-12-05 21:35


origen


Respuestas:


Un div es un elemento de bloque y abarcará el ancho del contenedor a menos que se establezca un ancho. Un tramo es un elemento en línea y tendrá el ancho del texto dentro de él. Actualmente, intenta establecer alinear como una propiedad de CSS. Align es un atributo.

<span align="center" style="border:1px solid red;">
    This is some text in a div element!
</span>

Sin embargo, el atributo de alineación está en desuso. Deberías usar el CSS text-align propiedad en el contenedor.

<div style="text-align: center;">
    <span style="border:1px solid red;">
        This is some text in a div element!
    </span>
</div>

143
2017-12-05 21:41



Por favor utiliza el siguiente estilo. margin:auto normalmente se usa para centrar el contenido. display:table es necesario para span elemento

<span style="margin:auto; display:table; border:1px solid red;">
    This is some text in a div element!
</span>

36
2017-08-19 17:21



los align atributo está en desuso. Use CSS text-align en lugar. Además, el lapso no centrará el texto a menos que use display:block o display:inline-block y establecer un valor para el ancho, pero luego se comportará igual que un div (elemento de bloque).

¿Puedes publicar un ejemplo de tu diseño? Use www.jsfiddle.net


22
2017-12-05 21:41



    span.login-text {
    font-size: 22px;
    display:table;
    margin-left: auto;
    margin-right: auto;
}

<span class="login-text">Welcome To .....CMP</span>

Para mí funcionó muy bien. prueba esto también


7
2018-02-04 14:34



Span es un bloque en línea y se ajusta al tamaño del texto en línea, con una tenacidad que bloquea la mayoría de los esfuerzos de estilo fuera del contexto en línea. Para simplificar el estilo de diseño (conflictos de límite), agregue div a la etiqueta 'p' con salto de línea.

<p> some default stuff
<br>
<div style="text-align: center;"> your entered stuff </div>

0
2018-05-13 07:44



Además de todas las otras explicaciones, creo que estás usando igualdad "=" signo, en lugar de dos puntos ":":

<span style="border:1px solid red;text-align=center">

Debería ser:

<span style="border:1px solid red;text-align:center">

-1
2018-04-06 09:30



Solo usa word-wrap:break-word; en el css. Funciona.


-3
2017-07-14 15:59