Question

I have a really simple table with two rows and two columns. I want the text in the first column to be right-aligned and the second column to be left-aligned. I’m sure this is really easy but I just can’t figure it out.

Here’s the HTML:

<table>
 <tr><td>Previous:</td><td>Link 1</td></tr>
 <tr><td>Next:</td><td>Link 2</td></tr>     
</table>

How would I do this?

Answer 1

I would use classes in this instance. You could get fancy but this is the best way for supporting.

CSS

.alignright { text-align: right; }
.alignleft { text-align: left; }

HTML

<td class="alignright"> </td>
<td class="alignleft"> </td>

You could go further by adding padding, margins and further classes. Depending on your TABLE css you might need to add some padding so that the cells aren’t all padding: 0 and not showing any alignment.