How to make table cell not expand when theres text in it?

Question

If I have a table with only 1 cell, and I set its width and height in its inline style to be a certain amount of pixels (fixed not percentage). What CSS property or attribute is there that will ensure the dimensions on the cell does not increase no matter how much content there is in it. I noticed on my cell, that when I add text, the dimensions still change even though I set it.

score 3 · Answer 1 · edited May 23 '17 at 10:34

3

You want to use the overflow property. In this case, it seems you want it hidden:

.cell1 {overflow: hidden;}

Read here for more options.

Also found this post indicating that you need to add table-layout: fixed; and white-space: nowrap; in addition to the overflow property.

edited May 23 '17 at 10:34

Community

1
1

answered Sep 09 '12 at 02:59

Kermit

33,827
13
85
121

score 3 · Answer 2 · answered Sep 09 '12 at 03:00

3

Set the table-layout to fixed and the overflow to hidden.

table {
    overflow:hidden;
    table-layout:fixed;
}

jsFiddle example

answered Sep 09 '12 at 03:00

j08691

204,283
31
260
272

How to make table cell not expand when theres text in it?

2 Answers2