Centro alinea texto "span" dentro de un div

Tengo un código HTML como;Centro alinea texto "span" dentro de un div

<div class="left"> 
<span class="panelTitleTxt">Title text</span> 
</div>

Mi CSS es el siguiente;

.left { 
    background-color: #999999; 
    height: 50px; 
    width: 24.5%; 
} 
span.panelTitleTxt { 
       display: block; 
       width: 100%; 
       height: 100%; 
}

¿Cómo centraré el texto dentro del div? (Suponga que el div "izquierdo" después de la conversión% obtiene un ancho de px de 100 px)

Intenté la forma estándar de usar margin:auto, pero eso no está funcionando.

También quiero evitar el uso de text-align:center.

¿Hay alguna otra forma de corregir esto?

Fuente

2011-10-25 testndtv

¿Por qué quieres evitar" text-align: center "si no te molesta que preguntes? –

Si quieres alinear en el centro el texto del span, usa 'span {text-align: center;}'. Si esto no produce el resultado que desea, tendrá que explicar por qué nosotros podemos ayudarlo (de lo contrario, solo tenemos que adivinar cuál es su los requisitos reales son.) –

Si es a _title_, use la etiqueta apropiada (h1, h2, h31 h4, h5 o h6), No use un semántico no . – Kyle

Le está otorgando al tramo un ancho del 100%, lo que hace que se expanda al tamaño del elemento primario. Esto significa que no se puede alinear en el centro, ya que no hay espacio para moverlo.

Puede darle al tramo un ancho determinado, luego agregue el margin:0 auto nuevamente. Esto lo alinearía en el centro.

.left 
{ 
    background-color: #999999; 
    height: 50px; 
    width: 24.5%; 
} 
span.panelTitleTxt 
{ 
    display:block; 
    width:100px; 
    height: 100%; 
    margin: 0 auto; 
}

Fuente

2011-10-25 08:29:56 Lee

No puede especificar el ancho de un elemento en línea (por ejemplo, un 'lapso '): http://stackoverflow.com/a/621406/343204 – Snowcrash

Puede cuando lo cambie también un elemento de bloque. – Lee

Si conoce la anchura del tramo sólo podría cosas en un margen izquierdo.

Prueba esto:

.center {text-align: center}
lapso div.center {display: table; }

Añadir el "centro: la clase a su

Si quieres algunos tramos centrados, pero no en otros, reemplazar el. 'Lapso div.center' en su hoja de estilo a una clase (por ejemplo," centro -span ") y agrega esa clase al span.

Fuente

2013-10-02 15:59:10 Cuse70

Centro alinea texto "span" dentro de un div

Respuesta

Cuestiones relacionadas