CSS text-align: center; no trabajar

tengo el código HTML siguiente:CSS text-align: center; no trabajar

<div id="footer"> 
    <ul id="menu-utility-navigation" class="links clearfix"> 
     <li class="menu-685 menu-site_map first">Site Map 
     </li> 
     <li class="menu-686 menu-privacy_policy">Privacy Policy 
     </li> 
     <li class="menu-687 menu-terms___conditions">Terms &amp; Conditions 
     </li> 
     <li class="menu-688 menu-contact_us last">Contact Us 
     </li> 
    </ul> 
</div>

Con el siguiente CSS:

div#footer { 
    font-size: 10px; 
    margin: 0 auto; 
    text-align: center; 
    width: 700px; 
}

me tiró en el bit de tamaño de fuente para ver si el estilo funcionaba (Firebug informa que es trabajando pero quería ver). Está funcionando. Pero el texto no está centrado en el pie de página en Firefox o en Safari (aún no lo he comprobado en IE).

He intentado con y sin margen: 0 auto; y con y sin text-align: center; ninguna combinación de esas cosas funcionó.

aquí se pusieron fuera de Firebug:

div#footer { 
    font-size: 10px; 
    margin: 0 auto; 
    text-align: center; 
    width: 700px; 
} 

Inherited fromdiv#page 
#skip-to-nav, #page { 
    line-height: 1.5em; 
} 

Inherited frombody.html 
body { 
    color: #666666; 
    font-family: verdana,arial,sans-serif; 
}

Ayuda?

Fuente

2011-06-05 Rebecca

un pequeño consejo: navegadores aplican estilos de derecha a izquierda, por lo que div # pie de página se analizan dos momentos en los que la página se carga, una penalización de rendimiento innecesaria (uno pequeño de todos modos) que se puede evitar porque se puede solo tiene un #footer por página. (Lo siento por mi ingles). – Tae

Gracias Tae! No lo sabía. Principiante con CSS básicamente. – Rebecca

Supongo que quiere todos los elementos uno al lado del otro, y todo se centrará horizontalmente.

li elementos son display: block por defecto, ocupando todo el espacio horizontal.

Añadir

div#footer ul li { display: inline }

una vez que hayas hecho esto, es probable que desee para deshacerse de las balas de la lista:

div#footer ul { list-style-type: none; padding: 0px; margin: 0px }

Fuente

2011-06-05 13:09:56

Sí, el ul ya se mostraba horizontalmente. Quería que esa navegación se centrara en el pie de página. Creo que el ul heredaba el ancho del div del pie de página. Establecí el ancho del ul y se centró. ¡Gracias! – Rebecca

Si desea que el texto dentro de los elementos de la lista que se centra, Proveedores:

ul#menu-utility-navigation { 
    width: 100%; 
} 

ul#menu-utility-navigation li { 
    text-align: center; 
}

Fuente

2011-06-05 13:10:33 Jits

Para hacer un centro align elemento inline-block horizontalmente en su matriz, agregue text-align:center t o su padre

Fuente

2015-06-12 02:13:16 DanKodi

esto funcionó para mí, gracias! He aplicado 'text-align: center' a los elementos de texto pero no al' div' que contiene – Andrew

-1

No sé que utilice cualquier versión Bootstrap pero la clase de ayuda útil para centrar y bloquear un elemento en el centro es .center-block porque esta clase contiene margindisplay y propiedades CSS, pero la clase .text-center sólo contienen la propiedad text-align

Bootstrap Helper Class center-block

Fuente

2015-11-28 09:55:19

que pidió ayuda con las propiedades de css. su recomendación es usar bootstrap para abstraer css, por lo que no está relacionado con el tema. – Andrew

CSS text-align: center; no trabajar

Respuesta

Cuestiones relacionadas