Help with column widths please

Help with column widths please

RickRick Posts: 8Questions: 1Answers: 0

Hi All,

I've got a 6 column table (first column is not visible) where two of the columns contain a variable amount of text - as much as 3 or 4 or 5 paragraphs. The other 3 columns contain a username or shortened url. I've got width set to 35% for the two text columns and 10% for the other three. The table is configured for fixedColumns.

The problem - the widths aren't even close to what I asked for and I don't know why?

Here are the options I used when initializing the table - browser console output.

Thanks for any help you can provide.

Rick

PS. I moved the invisible column from the first to the last position and that helped. The 'Document' column is much bigger, even bigger than I want. The 'Note' column is too small. The others are fine.

dtOptions:  
Object {pageLength: 20, fixedColumns: true, columnDefs: Array[6], aoColumnDefs: Array[6], iDisplayLength: 20}
  aoColumnDefs: Array[6]
  columnDefs: Array[6]
  0: Object
    sTitle: "Tags"
    sWidth: "10%"
    targets: 0
    title: "Tags"
    width: "10%"
  1: Object
    sTitle: "Document"
    sWidth: "35%"
    targets: 1
    title: "Document"
    width: "35%"
  2: Object
    sTitle: "Note"
    sWidth: "35%"
    targets: 2
    title: "Note"
    width: "35%"
   3: Object
    sTitle: "Url"
    sWidth: "10%"
    targets: 3
    title: "Url"
    width: "10%"
   4: Object
    sTitle: "User"
    sWidth: "10%"
    targets: 4
    title: "User"
    width: "10%"
   5: Object
    bVisible: false
    sTitle: "Id"
    targets: 5
    title: "Id"
    visible: false
length: 6
fixedColumns: true
iDisplayLength: 20
pageLength: 20

Answers

  • allanallan Posts: 63,356Questions: 1Answers: 10,444 Site admin

    Can you give a link to the page showing the issue please? Column widths are really tricky - the browser can overrule the sizes you give is it thinks it is the correct thing to do - so we really need a test case to understand why it is doing that in this particular case.

    Allan

  • RickRick Posts: 8Questions: 1Answers: 0

    Hi Allan,

    You can find an example here: Example

    Enter this value *http://christmind.info/raj/yaa/030682d.html* into the 'Enter URL' input field. That should demonstrate the issue.

    Thanks for your help.

    Rick

  • allanallan Posts: 63,356Questions: 1Answers: 10,444 Site admin

    Hi Rick,

    It actually looks quite good to me - the Note column is 349px wide (including the padding and border) while the table is 1081px - so the Note column is 32.2% of the table width. Not perfect, but close.

    Part of the reason that it isn't perfect is that the User column can't fit into the assigned 10% (the string Kate_Macnamara is forcing the width) so the browser is compensating for that.

    Allan

  • RickRick Posts: 8Questions: 1Answers: 0

    Hi Allan,

    Thanks for looking at this. I notice the column widths are wildly variable depending on the query. Plug this value into the URL input field: http://christmind.info/raj/yaa/022882.html and see what happens.

    In this case the Document column is much wider BUT... that's because there is no data in the Note column. I agree with you - it's not bad. I've been arguing with the column widths all day and they seem pretty persuasive. Moving the invisible column from the first to last position made a big difference.

    Thanks for your help!!

  • allanallan Posts: 63,356Questions: 1Answers: 10,444 Site admin

    Interestingly the URL input you suggest appears to render quite well for me as well. Chrome 46 Mac.

    What browser are you using?

    Allan

  • RickRick Posts: 8Questions: 1Answers: 0

    Yeah, I'm using Chrome 46 Mac too.

  • allanallan Posts: 63,356Questions: 1Answers: 10,444 Site admin

    Interestingly, I've just tried it on a different machine (Chrome 43 Mac) and I absolutely see the issue. Not immediately sure what would cause that I'm afraid...!

    Allan

  • allanallan Posts: 63,356Questions: 1Answers: 10,444 Site admin

    And with Chrome 46 Mac after updating on this machine... I'll try to look into it in the next few days.

    Allan

  • RickRick Posts: 8Questions: 1Answers: 0

    Thank you Allan - I appreciate it.

    Rick

This discussion has been closed.