|
I have a list of 8 key/value pairs I'm displaying in a sidebar using a table element. I'm using a th and td element on each row. However, the td content is often too long and has to be truncated. I could increase the width of the sidebar but the td content is of variable length and also, that won't work so well on mobile devices. How else could I display key/value pairs in a way that:
|
||||
|
|
Agree with Schroedingers Cat, no easy answer, and it will depend a lot on what exactly you are trying to do. But if the values are that long, it looks more to me like a title/paragraph situation rather than a key/value pair. Maybe it's worth experimenting with a definition list (dl/dt/dd) approach? With a bit of javascript you can change the css floats according to window size and text size, so that it mimics a table or a heading/section layout, i.e. Wide-enough page: key | this value is a really long one, but so long you've never seen one -- lorem ipsum dolores sit amet Narrow page: key |
|||
|
|
|
It is difficult, and there is no simple answer to it. Putting an abbreviated version in the text, and using mouseover/tooltips to show the entire text is the common approach. However, there is also the question of whether you NEED to have unlimited length entries, and whether you could put a restriction on them. If they are just references, you shouldn't have long text in them. Of course, it depends on your application, but solving a problem at source is better than solving it later. |
|||
|
|
