Texto del centro en la celda de la tabla

Parece que no puedo encontrar la respuesta a mi problema. Tengo una tabla con dos filas y dos columnas (como el código que se muestra a continuación), cómo centrar el texto en celdas específicas. Me gustaría centrar el texto en una o dos de las celdas, no en todas las celdas.Texto del centro en la celda de la tabla

<div style="text-align: center;"> 
    <table style="margin: 0px auto;" border="0"> 
     <tbody> 
      <tr> 
       <td>Cell 1</td> 
       <td>Cell 2</td> 
      </tr> 
      <tr> 
       <td>Cell 3</td> 
       <td>Cell 4</td> 
      </tr> 
     </tbody> 
    </table> 
</div>

Fuente

2011-10-03 Jack Stevens

Recomendaría usar CSS para esto. Debe crear una regla CSS para hacer cumplir el centrado, por ejemplo:

.ui-helper-center { 
    text-align: center; 
}

Y a continuación, añadir la clase ui-helper-center a las celdas de la tabla para las que se desee controlar la alineación:

<td class="ui-helper-center">Content</td>

EDIT: Desde que se aceptó esta respuesta, me sentí obligado a editar las partes que causaron una guerra de llama en los comentarios, y no promocionar las prácticas deficientes y desactualizadas.

Para saber cómo incluir la regla de CSS en su página, consulte Gabe's answer.

Fuente

2011-10-03 21:59:13

CSS 1 se convirtió en una recomendación hace casi 15 años. No use el atributo de alineación. – Quentin

@Quentin - De acuerdo sobre "no usar" alinear '". Pero el mismo Cory Larson recomendó el equivalente de CSS sobre "align = center". Espero que no lo marque (y si lo hizo, por favor considere cambiarlo. ¿Está bien?) – paulsm4

@ paulsm4 - No lo hice, y él no lo hizo cuando hice el comentario. – Quentin

¿Qué tal, simplemente (Tenga en cuenta, llegar a un mejor nombre para el nombre de la clase Esto es simplemente un ejemplo):

.centerText{ 
    text-align: center; 
} 


<div> 
    <table style="width:100%"> 
    <tbody> 
    <tr> 
     <td class="centerText">Cell 1</td> 
     <td>Cell 2</td> 
    </tr> 
    <tr> 
     <td class="centerText">Cell 3</td> 
     <td>Cell 4</td> 
    </tr> 
    </tbody> 
    </table> 
</div>

Ejemplo here

puede colocar el css en un archivo separado, que se recomienda. En mi ejemplo, creé un archivo llamado styles.css y coloqué mis reglas css en él. Entonces incluirla en el documento HTML en la sección <head> de la siguiente manera:

<head> 
    <link href="styles.css" rel="stylesheet" type="text/css"> 
</head>

La alternativa, no crear un archivo CSS independiente, no se recomienda en absoluto ... Crear <style> bloque en su <head> en el documento html . Entonces solo coloca tus reglas allí.

<head> 
<style type="text/css"> 
    .centerText{ 
     text-align: center; 
    } 
</style> 
</head>

Fuente

2011-10-03 21:59:05 Gabe

Texto del centro en la celda de la tabla

Respuesta

Cuestiones relacionadas