Home/ Questions/Q 8635981
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T10:06:34+00:00

I have a CSS table which is reused throughout my code. The size of

  • 0

I have a CSS table which is reused throughout my code. The size of the data, and the number of columns for the table varies every time the table is used.
The max width (set by CSS) for the table is 80% of page. However, Sometimes when the table has a little data (maybe extending table to 50% of the page) some lines of text will separate into two lines. How to I counteract this, so the table uses all the space available to it.

This is what happens at the moment:

Problem

I’ve tried setting the manual width for the table, but that means the table remains stretched even when the table width only needs to be small.

I’ve also tried using CSS white-space:nowrap; However this cause the table to extend beyond 80% if there is a lot of data in one column.

Anyway to solve these two problems with CSS?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Just use this css:

    td
{
white-space: nowrap; overflow: hidden; text-overflow:ellipsis;
}​

    And the result is like this: http://jsfiddle.net/ongisnade/pghny/

    • 0