Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it impossible to fit a large html table into a small space?

The obvious answer to this is "it's not possible" or "make the data smaller"...I have tried these and they don't wash so I need to come up with an alternative

There is a table on a web page that has 14 columns in it. 2 of the columns have text in that is quite long (but cannot wrap - the text must be all on one line for each row). Needless to say, the table disappears off the right hand side of the screen after about column 9!

So, can anyone think of a magical solution that will make this table fit fully onto the screen?

Bad Answers:

  • Reduce the amount of data
  • Allow the text in the rows to wrap onto a second line
  • "It can't be done" - yes I know, but someone somewhere will have a genius answer, or some magical jQuery library that does this kind of thing

Intriguing but more information would be needed:

  • Squish all of the columns down enough so the table fits, and then have overflowed data which can be viewed when the column is expanded

    e.g.: |This is my data but it's...|

like image 755
Paul Avatar asked Sep 07 '09 12:09

Paul


2 Answers

Display the text with an ellipsis after the 10th character and display a hint text with the full text when the user moves his mouse over it…

An ellipsis are three dots… I use them quite often… Did you see?…

like image 141
Wim ten Brink Avatar answered Sep 27 '22 23:09

Wim ten Brink


Show each logical row in two actual rows, making them clearly coherent using zebra stripes?

I can imagine situations where that would work, but it's highly dependent on the data.

like image 33
Jon Skeet Avatar answered Sep 27 '22 23:09

Jon Skeet