Centra il testo nella cella della tabella

Non riesco a trovare la risposta al mio problema. Ho una tabella con due righe e due colonne (come il codice mostrato sotto), come faccio a centrare il testo allineato in celle specifiche. Vorrei centrare il testo allineato in una o due celle, non in tutte le celle.Centra il testo nella cella della tabella

<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>

fonte

2011-10-03 Jack Stevens

Si consiglia di utilizzare CSS per questo. È necessario creare una regola CSS per far rispettare la centratura, ad esempio:

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

E poi aggiungere la classe ui-helper-center alle celle della tabella per cui si desidera controllare l'allineamento:

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

EDIT: Poiché questa risposta è stata accettata, mi sono sentito obbligato a modificare le parti che hanno provocato una guerra di fuoco nei commenti e a non promuovere pratiche scadenti e obsolete.

Vedere Gabe's answer per come includere la regola CSS nella pagina.

fonte

2011-10-03 21:59:13

La CSS 1 è diventata una raccomandazione quasi 15 anni fa. Non utilizzare l'attributo align. – Quentin

@Quentin: concordato su "non utilizzare 'allineare" ". Ma Cory Larson stesso ha raccomandato l'equivalente CSS su "align = center". Spero che tu non lo annulli (e se lo hai fatto, per favore considera di cambiarlo. OK?) – paulsm4

@ paulsm4 - Non l'ho fatto, e non l'aveva fatto quando ho fatto il commento. – Quentin

ne dite semplicemente (Si prega di notare, venire con un nome migliore per il nome della classe questo è semplicemente un esempio):

.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>

Esempio here

è possibile inserire il css in un file separato, che è raccomandato. Nel mio esempio, ho creato un file chiamato styles.css e inserito le mie regole css al suo interno. quindi includere nel documento HTML nella sezione <head> come segue:

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

L'alternativa, non la creazione di un file CSS separato, non è raccomandato a tutti ... Creare <style> blocco nel vostro <head> nel documento HTML . Quindi metti le tue regole lì.

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

fonte

2011-10-03 21:59:05 Gabe

Centra il testo nella cella della tabella

risposta

Problemi correlati