Is there anything built into to Twitter Bootstrap 2.0 to align table contents?

Question

It is easy to align table by setting "align" attribute, but table aligning by css is a bit hacky. Is there built-in support for tables aligning in Twitter Bootstrap 2.0?

I'm not sure this is 'hacky'. Bootstrap is just that a bootstrap to get things started and is meant to be built upon. — Ant Swift, Oct 29 '12 at 10:33

score 24 · Answer 1 · edited Jan 04 '13 at 16:20

24

There is nothing built in to support this but it is very easy to add something like:

.table th.rightCell,
.table td.rightCell {
  text-align: right;
}

edited Jan 04 '13 at 16:20

ebottard

1,987
2
11
14

answered Oct 29 '12 at 10:40

Ant Swift

17,721
10
35
55

25

Alternatively to keep Bootstrap's naming conventions and to utilize the pre-built `text-right` class, you should add this to your own css: `.table th.text-right, .table td.text-right { text-align: right; }` and then use `Ta-dam` – Attila Fulop May 08 '13 at 04:11

score 12 · Answer 2 · answered Mar 27 '13 at 15:06

12

Bootstrap's alignment classes include .text-right which sets text-align: right.

Unfortunately Bootstrap sets text-align: left for table cells so applying .text-right to a <td> doesn't have any effect:

<td class="text-right">
  Still left aligned
</td>

Adding .text-right to a block element inside the cell however does work:

<td>
  <p class="text-right">Right aligned</p>
</td>
<td>
  <div class="text-right">Right aligned</div>
</td>

answered Mar 27 '13 at 15:06

Stefan

96,300
10
122
186

11

I'm using Bootstrap 3.0, and `.text-right` works perfectly when applied directly to a ``. – Jeremy Visser May 17 '14 at 11:11

score 0 · Answer 3 · answered Nov 03 '12 at 13:18

0

For "td" I used this which is included in bootstrap css:

<td class="pagination-centered">

answered Nov 03 '12 at 13:18

trante

30,976
45
174
260

"pagination-centered" – fedmich Mar 24 '15 at 11:02

Is there anything built into to Twitter Bootstrap 2.0 to align table contents?

3 Answers3