Table properties

stemitch2000 · Jan 28, 2004

I have a table linked to a database. The links is working fine - it's just the formatting that I need help with.

2 questions.
firslty, is there a simple way of getting a cell to "auto width" (like you can on excel?)

secondly, when I choose to put borders around the cells, if they contain no data - the border doesn't appear, but if there is data - it does. Any idea to put a border around each cell regardless?

BabyJeffy · Jan 28, 2004

There is no simple way to force "auto widths" as you ask. You can look into replacing all spaces with non breaking space characters... that's one solution (but depending on the data this could be a pain -- and it's not going to be perfect all of the time).

If you don't specify any widths for your table or td's (and your table isn't in a div with a fixed width for instance) then the table will be more flexible in auto sizing.

To get borders working, you can test the data from the database server-side and use a non breaking space "&nbsp ;" (remove the space between the &nbsp and the

when the data for a cell is empty. That will provide a cross-browser, fully deprecating solution that is predictable.

It's a start at least! Someone else may have better suggestions... let's sit back and wait.

Jeff

Vragabond · Jan 28, 2004

regarding the first question, you force no text wrapping in your table cells with css.
<style>
td { white-space: nowrap; }
</style>

This way all the table cells won't wrap the text. You could try with classes
<style>
td.nowrap { white-space: nowrap; }
</style>

<td class="nowrap">This text will never wrap</td>

or even dependencies:
<style>
table.nowrap td { white-space: nowrap; }
</style>

<table class="nowrap">
<tr>
<td>This text will never wrap</td>
</tr>
</table>

Second question. You have a css solution, but I don't know how cross-browser it is supported, since it is part of the CSS2 standard. the property relates to table and is:

table { empty-cells: show; }

If you have trouble getting the result across all the browsers, there's always Jeff's suggestion: using   in your empty cells.

BabyJeffy · Jan 28, 2004

Vragabond...

I was quite keen to try out your solution (since I'm getting sick of enforcing non breaking spaces in my own tables)... so I gave it a go:

Code:

<html>
<head>
<style type=&quot;text/css&quot;>
table { empty-cells: show; }
</style>
</head>
<body>
<table border=&quot;1&quot; cellspacing=&quot;1&quot; cellpadding=&quot;3&quot;>
<tr><td>ONE</td><td></td></tr>
<tr><td>THREE</td><td>FOUR</td></tr>
</table>
</body>
</html>

It doesn't seem to do anything special on my IE 6 for Windows browser. The settings for my browser haven't been tweaked etc... it just doesn't produce the expected result.

Thoughts?

Jeff

Vragabond · Jan 28, 2004

Like I said, it is a CSS2 standard property and unfortunately IE does not support the CSS2 standards yet. I did warn about this. This settings gives expected results in css2 compliant browsers such as Mozilla and Opera though.

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Table properties

stemitch2000

Programmer

BabyJeffy

Programmer

Vragabond

Programmer

BabyJeffy

Programmer

Vragabond

Programmer

Similar threads

Part and Inventory Search

Sponsor