ansaurus

Question

Answer 1

+5 A:

To your <table> element, add:

style="width: 100%"

Everything is working perfectly, your table just isn't big enough to see it.

jvenema 2009-12-10 15:48:45

Yup. I feel dumb. lol

Earlz 2009-12-10 15:53:28

+1, indeed. And turning the border on would have made the OP realise straight away what was going on.

Wim Hollebrandse 2009-12-10 15:54:48

Set also `table-layout: fixed` to tell the browser you really mean it so that it doesn't “helpfully” change the cell widths for you. (This also renders faster.)

bobince 2009-12-10 15:58:44

Answer 2

+1 A:

You don't have a width specified for your table, so it is only as wide as it needs to be, therefore you can't see the text alignment making any difference.

Try this

<table style="width: 100%">

and take another look.

nickf 2009-12-10 15:49:06

gah, I was not quick enough.

Agos 2009-12-10 15:51:02

Answer 3

A:

Any reason to use a table for the layout? Use two divs instead, put their width to 50% each, and float the second div to the right.

Konrad Rudolph 2009-12-10 15:50:43

Add a 3rd cell to that table. Pretty trivial right? Not so trivial with floating divs.

Earlz 2009-12-10 15:52:56

@earlz: well, depends. The HTML code is trivial. The CSS code is only *slightly* more complex – just add appropriate margins to the `div`s. True problems arise when you want to make all `div`s the same height, regardless of their content height – but (pure CSS) solutions exist for that, as well.

Konrad Rudolph 2009-12-10 20:23:18

Answer 4

A:

Add a width to your table..

<table style="width: 100%">

Edit: tooo Slow

Doc Snuggles 2009-12-10 15:50:52

Answer 5

+1 A:

If you're looking to put an image side by side with text on separate sides of a table you can use the following:

<table style="width: 100%">
<tr>
<td style="text-alight: left;">
text
</td>
<td style="text-align: right;">
  <table style="width: 100%">
    <tr>
      <td style="text-align: left;">image</td>
      <td style="text-align: right;">text</td>
    </tr>
  </table>
</td>
</tr>
</table>

That should get you something like

-----------------------------
|text    |image    |    text|
-----------------------------

Brian Hasden 2009-12-10 15:51:49

Answer 6

A:

Are you always going to be using a table? If so the above answers will work. But if you are using two divs within a container div, you need to float the inside divs to the left and right respectively and then clear your floats in the container div.

ryanulit 2009-12-10 15:52:33

ansaurus

tags:

views:

answers:

text-align not working as expected

related questions