Question

I have no idea how to do that and it is very frustrating.

I’ve tried this, but it doesn’t do anything.

table td
{
    table-layout: fixed;
    width: 200px;
    word-wrap:break-word;
}

And also maybe it is possible to somehow style every column separately. I’m using Code Igniter table helper module so I have little access over each td, tr etc…

Okey, I fixed my problem using
table

{
    word-break: break-all;
}

td
{
    padding-left: 6px;
    padding-right: 6px;
    max-width: 500px;
    min-width: 100px;
}

Still I will probablt build my own HTML Table class to make things much easier and more controllable in future.

Answer 1

The table class is somewhat limited in what it can and can’t do as you’ve probably noticed.

If you need anything more than the basic table (you can set even/odd row classes in CI), then you will likely need to create your own table class/create your own table output (it’s not exactly difficult).

Also, I’m pretty sure CI’s table generator will force a width, unless you specify otherwise with a custom template

$tmpl = array (
'table_open'   => '<table border="0" width="XXX" cellpadding="4" cellspacing="0">',

As a result, even if you style the TD’s, the table width will still take priority if you like and confine the TDs.

A table width of 100% will still fill all the available width and force the TD’s to be sized that way, even if your css says otherwise.

The only way I know around this is to either ommit the width from the <table> entirely which could be unpredictable, or set the table to be as wide as 200 * number of columns, and everything will display nicely.

(If you add inline-block to the TD you can force the width to 200px, but table td’s, by default are display:table-cell)