Here is the table I am working with:
table td {
width: 200px;
text-align: center;
}
.red {
border:1px solid red;
}
<table>
<thead>
<tr>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td class="red">$ 11.122,00</td>
</tr>
<tr>
<td class="red">$ 11.1,00</td>
</tr>
<tr>
<td class="red">$ 11.122,00232</td>
</tr>
<tr>
<td class="red">$ 11.122,00</td>
</tr>
</tbody>
</table>
I am trying to center the numbers within each td
, but I can't figure out how to stack the numbers vertically while keeping them centered. Adjusting the CSS to right-align the numbers simply moves them to the right side of the cell without stacking them as needed.
Instead, I want the numbers to remain centered within each cell, stacked neatly on top of each other for a cleaner presentation in the table.