Here is an example with CSS and inline style
attributes:
td _x000D_
{_x000D_
height: 50px; _x000D_
width: 50px;_x000D_
}_x000D_
_x000D_
#cssTable td _x000D_
{_x000D_
text-align: center; _x000D_
vertical-align: middle;_x000D_
}
_x000D_
<table border="1">_x000D_
<tr>_x000D_
<td style="text-align: center; vertical-align: middle;">Text</td>_x000D_
<td style="text-align: center; vertical-align: middle;">Text</td>_x000D_
</tr>_x000D_
</table>_x000D_
_x000D_
<table border="1" id="cssTable">_x000D_
<tr>_x000D_
<td>Text</td>_x000D_
<td>Text</td>_x000D_
</tr>_x000D_
</table>
_x000D_
EDIT: The valign
attribute is deprecated in HTML5 and should not be used.
HTML in line styling example:
<td style='text-align:center; vertical-align:middle'></td>
CSS file example:
td {
text-align: center;
vertical-align: middle;
}
<td align="center" valign="center">textgoeshere</td>
Is the only correct answer imho, since your working with tables which is old functionality most common used for e-mail formatting. So your best bet is to not use just style but inline style and known table tags.
Try to put this in your CSS file.
td {
text-align: center;
vertical-align: middle;
}
The following worked for me to vertically align content (multi-line) in a list-table
.. list-table::
:class: longtable
:header-rows: 1
:stub-columns: 1
:align: left
:widths: 20, 20, 20, 20, 20
* - Classification
- Restricted
- Company |br| Confidential
- Internal Use Only
- Public
* - Row1 col1
- Row1 col2
- Row1 col3
- Row1 col4
- Row1 col5
Using theme overrides .css option I defined:
.stub {
text-align: left;
vertical-align: top;
}
In the theme that I use 'python-docs-theme', the cell entry is defined as 'stub' class. Use your browser development menu to inspect what your theme class is for cell content and update that accordingly.
Selector > child:
.text-center-row>th,_x000D_
.text-center-row>td {_x000D_
text-align: center;_x000D_
}
_x000D_
<table border="1" width='500px'>_x000D_
<tr class="text-center-row">_x000D_
<th>Text</th>_x000D_
<th>Text</th>_x000D_
<th>Text</th>_x000D_
<th>Text</th>_x000D_
</tr>_x000D_
<tr>_x000D_
<td>Text</td>_x000D_
<td>Text</td>_x000D_
<td>Text</td>_x000D_
<td>Text</td>_x000D_
</tr>_x000D_
<tr class="text-center-row">_x000D_
<td>Text</td>_x000D_
<td>Text</td>_x000D_
<td>Text</td>_x000D_
<td>Text</td>_x000D_
</tr>_x000D_
</table>
_x000D_
The CSS to center text in your td
elements is
td {
text-align: center;
vertical-align: middle;
}
<td align="center"valign="center">textgoeshere</td>
Source: Stackoverflow.com