Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 265
  • Last Modified:

How do I constrain the width of a table cell?

In the application I'm developing I have about 5 layers of nested lists. Each <li> contains a one row table. This makes it possible to display tabular data on a decreasing level of quantity. And it also makes it possible to have the table/rows hidden and appearing on clicking a parent row.

I would have preferred to have set up one table and use <tbody> tag to differentiate between levels, but that and the table-row-group is not supported by IE 7 or below so I had to come up the the above alternate solution. With one table I would have been more easily able to constrain the width of cells in columns, with all cells in a column having the same assigned width, but I have one-row tables and I'm trying to contrain the width of each cell and no matter what I've done I haven't gotten it to work.

I've tried simply setting the width within the html <td> tag, e.g. <td width="210">

I've tried setting the width with CSS, e.g.
table.rpd_row td.toleft{
	text-align:left;
	min-width:210px;
	width:210px;
	max-width:210px;
}

Open in new window


Neither of these methods keep the width of the cell at one set width. If a longer text is put in that cell, even though the text is not as wide as the cell, it expands the width of it.

Anyone have an idea how I can handle this?

Thanks
0
denewey
Asked:
denewey
  • 2
1 Solution
 
Randy DownsOWNERCommented:
Try this - http://vinhboy.com/blog/2009/02/13/ie7-table-width/

Finally I found this property

table-layout: fixed;
0
 
JF0Commented:
Can you provide a link or source code?
0
 
deneweyAuthor Commented:
I'm not sure what to make of this.

table-layout: fixed; was an excellent answer, but when I applied it, it handled the tables I was having trouble with and broke the ones that were fine. I'll mess around with is some more and see what I can sort out.

Thanks
0
 
deneweyAuthor Commented:
This solution made it possible for me to control the cell widths in IE, but now text that wraps gets the bottom of it chopped off and in Firefox the layout is out of whack. The width of the cells are controlled, but the display of each row is wider than it was before, putting it out of proportion to other tables.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to Squarespace.com and use offer code ‘EXPERTS’ to get 10% off your first purchase.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now