using class with max-width to control column size. found odd behavior in that the value is ignored

kdubs

I'm trying to rewrite code that will change the width of columns dynamically by dragging on them. It works by recreating the datatable and passing in values for the new widths, and by altering a class containing the max-width for the column.

during the debugging process I ran across something odd. it seems that it doesn't matter what I set max-width to, I just need to set it to something.

I suspect I'm missing another width being set some place, but I can't find it in the debugger.

at line number 86 you can see where I've replaced the value I should be using for the width with 0.

any thoughts as to what is going on?

here's link to tests case : https://live.datatables.net/yevaweya/1/edit?html,output

allan

HTML tables don't obey the standard width controls that you would expect when working with divs. The only way to get absolute pixel control over table column widths is to use table-layout: fixed. With that you will then be able to create something that allows column resizing.

With regular table layout the browser can overrule your widths - and indeed as you work with a fixed layout table you'll quickly realise just how often it needs to do that. Making all the columns add up to 100% width is very difficult .

Allan

kdubs

I looked at fixed, but then if you use hidden columns when you try to make them visible it gets real messy. I was trying to only constrain the ones the user actual adjusted and let the others "float".

the part I don't understand, is why setting max-width to any value makes my code work. If I don't set it, the code fails. I've seen this on multiple browsers. It seems that the mere act of setting max-width triggers some behavior, regardless of the value

allan

Very possibly! At some point I need to read through the Firefox or Chrome code for table width calculations and understand the fine details.

One hack I've used before is to put a div into the header cell. Then you can use fine control of the width on that and it will force the width of the table. As you say, there are complications when showing and hiding columns, though. Updating data, paging, etc all can cause complexities. You can see that in your example if you try to drag a column so wide than the rest of the content of the table wouldn't fit - it is simply overruled.

Sorry I don't have a simple and good answer for you!

Allan

kdubs

and I thought you were the expert ... 8- )

let me try one more question, and then I'll put this to bed.

in "theory" is my idea of setting max-width on the columns that the user is interested is the right way to go?

allan

I don't know to be perfectly honest. I don't really see what it would make a difference if it were set. Its a clever way of doing column resizing that you have there and if that quirk is what the browser's need, then I guess go with it!

Possibly my worse support thread - apologies .

Allan

kdubs

thanks for your thoughts and your code. I'll go with setting max-width to the calculated value and get on with things.