empty cell in table

[lunatic]

Okay this is really kind of a random place to post a question like this but since this forum kicks butt over all other forums I've found I'll give it a shot. :D

I am building a project log in coldfusion using dreamweaver (database is sql server). User can add a project to the main table via a form. When the user hits the submit button they are taken to a form where they can see what they have submitted. There is another form where the user can list all the projects in the db. Okay, so in the form to add a project there are a few cells that do not require some kind of input - you can leave it blank. But then when you go to the form that lists all the projects there are these big holes. The page is formatted as a table with a border value of 1. But if there is no data for that cell then it doesn't draw the border so there are these big gaps everywhere.

So long explanation to my short question - how do I get the border to draw around the cell even if there is no data in it?

Thanks for any help!
:hr:

[tbarjoe]

Try putting a non-breaking space in each of the empty table cells. "&nbsp" I think that'll work, I don't believe that CSS styles, or borders are applied unless there is some sort of element in the table, hence the need for the non breaking space.

[simplistik]

In CSS if you make the table make the box size a specific size and use the border properties it will make a border around that empty frame I'll post an example shortly the css is in the page not external so you just need to view source. hope this helps

http://www.beyondthepixel.com/downloads/emptytable.htm

[lunatic]

I've never used css before - I'm just using very basic html and coldfusion and writing directly in dreamweaver. Might be nice to pick up some CSS while I"m at it I guess! :)

Thanks for the example - can you explain a little how it works? I see the class boxborder in the body and .boxborder defined in the style but could you explain type maybe? No explanation is too simple lol, I can understand how code works when it is explained to me but like I said, I'm pretty new. All I know about CSS is what the letters stand for . . . :D

@tbarjoe - I'll give that a try too!

[lunatic]

I've never used css before - I'm just using very basic html and coldfusion and writing directly in dreamweaver. Might be nice to pick up some CSS while I"m at it I guess! :)

Thanks for the example - can you explain a little how it works? I see the class boxborder in the body and .boxborder defined in the style but could you explain type maybe? No explanation is too simple lol, I can understand how code works when it is explained to me but like I said, I'm pretty new. All I know about CSS is what the letters stand for . . . :D


@tbarjoe - I'll give that a try too! :hr:

[tbarjoe]

<style type="text/css">
<!--
.boxborder {
margin: 0px;
padding: 0px;
height: 100px;
width: 100px;
border: medium solid #000000;
}
-->
</style>

<tr>
<td align="center" valign="middle"><table align="center">
<tr>
<td class="boxborder">&nbsp;</td>
</tr>
</table></td>
</tr>
</table>

[tbarjoe]

The CSS definition .boxborder is pretty much just a way to define a style that you apply to as many table cells as you want. This way you don't have to repeat the formatting all over the place. Define it once, use it lots. This also is handy because you only have to change it in one place to change it all over the site (or where ever you use the css definition), this saves you from having to do lots of searches and replaces.

Now let's go though each of the attributes of the definition

margin: 0px; Says there is no margin in the table cell

padding: 0px; Same thing as "cellpadding="0", but this is how it's done in CSS

height: 100px; Sets the height of the table cell, you can do the same thing in HTML

width: 100px; Sets the width (same)

border: medium solid #000000; This is CSS shorthand for setting up the border properties, it's probably more indepth than what you've use (I'm assuming here), this says to use a medium width border, that is solid (not dashed or dotted) and is of the color #000000 (black). You can do all sorts of cool border formatting in CSS, like specifying each side of the border separately.

http://www.w3schools.com/css/default.asp <- this is a great resource for leaning CSS stuff. If you're planning on doing much web design at all, I highly suggest learning CSS, they are very handy, and it's definately a good skill to have.