How to centralize an information for all TDs by CSS?

3

I'm with a lot of <td> and I need them centralized. I would like to do it by CSS, for example

td {
   puxar por aqui.
}

This instead of putting align="center" on all tds.

How to do this, affecting all table cells on the page?

    
asked by anonymous 20.09.2016 / 19:55

5 answers

6
td {
   text-align: center;     /* alinhamento horizontal */
   vertical-align: middle; /* alinhamento vertical */
}

This rule would apply to all TDs, unless some later or more specific rule overrides these alignment properties in your CSS.

    
20.09.2016 / 19:58
2

Just use:

td{
  text-align: center;
}
    
20.09.2016 / 20:03
1

You can try to put an id to the table if it does not already have it and then apply the style you want for all td

#teste td{
  text-align: center;
};
<table>
    <thead>
        <tr>
            <th>Nome</th>
            <th>Posição</th>
        </tr>
    </thead>
    <tbody id="teste">
        <tr>
            <td>Leonardo</td>
            <td>1º Colocado</td>
        </tr>
        <tr>
            <td>Batman</td>
            <td>2º Colocado</td>
        </tr>
        <tr>
            <td>Homer Simpson</td>
            <td>3º Colocado</td>
        </tr>
    </tbody>
</table>

Or there's also the option of creating a class in and defining its style by css.

Ex:

.td-alinhado-centro{
    text-align: center;
}

So you would have to assign this class to all the td's that you want to be aligned that way.

    
20.09.2016 / 20:08
0

The outermost you should put the property text-align:center; , and put the property margin:auto;

HTML

    <div class="container">
    <td>Alinhado</td>
    </div>

CSS

   .container{
     width: 100%;
     height: 300px;
     text-align:center;
   }

   .container td{
     margin:auto;
   }

Example: link

    
20.09.2016 / 20:25
0
<tr><td>Alinhar item ao centro</td></tr>

td {      text-align: center;      vertical-align: center; }

Or if you do not want to move all the items in future tables, you should create a class and assign a certain margin to the elements.

    
21.09.2016 / 19:11