File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
http://aspose.com/file-tools
The moose likes HTML, CSS and JavaScript and the fly likes Another table border question Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Another table border question" Watch "Another table border question" New topic
Author

Another table border question

Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

I have a table that is 10 rows and 2 columns and I need a border around every cell. The problem is that if you create a

border: solid 1px #000000;

for each cell, then you get double width on the inner border because of the left and right cell. Same for top and bottom in the middle cells.

So the other way is to specify a border for say left, top, bottom for one cell and right, top, bottom for another then as you work your way down, interchanging top and bottom accordingly. MESSY

Is there a neater easier way to apply a css border to a table that takes care of all the sides of every cell neatly and cleanly, just like the default table border attribute.

Thanks.


GenRocket - Experts at Building Test Data
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
I am to busy to test this, but this should just give a 1pixel border between everything....

TD { border: 1px solid blue;}

Am I right?

Eric
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
Also I have a link book,arked about tables: http://www.w3.org/TR/REC-CSS2/tables.html

bunch of stuff there if I remember correctly.

Eric
Pedro Penna
Ranch Hand

Joined: Jun 05, 2004
Posts: 46
Try the border-collapse attribute, like: style="border-collapse:collapse".
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

Originally posted by Eric Pascarello:
I am to busy to test this, but this should just give a 1pixel border between everything....

TD { border: 1px solid blue;}

Am I right?

Eric


No, this puts a border around the cell, but if I put the same code for the cell next to it, I get 2px solid blue line down the middle.
[ July 14, 2004: Message edited by: Gregg Bolinger ]
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

Originally posted by Pedro Penna:
Try the border-collapse attribute, like: style="border-collapse:collapse".


That doesn't do anything.
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

From what I can tell from the doc Eric linked to, there isn't a neat easy method of doing what I want to do. It looks like ass no matter what way I do it.
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

This is what I am talking about:

The style:



The HTML



If I add more rows, I have to add two more styles. This seems rediculous for what I am trying to achieve so I was hoping there was an easier way. I don't understand how I can say



And the border surrounds every cell appropriately, but as soon as I want to change the look of the border, the CSS is insane. BTW, did I say I hate HTML?
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61180
    
  66

HACK ALERT! HACK ALERT! But this may do what you want:

1) Choose a cellspacing of 1
2) Set the background color of the table to black (or whatever)
3) Set the td backgrounds to white

The table background shows through the spacing around the cells.

I am so ashamed I know that.


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
Pedro Penna
Ranch Hand

Joined: Jun 05, 2004
Posts: 46
You don't need the "class" attribute in the table cells in this case.

Try this:



Notice the bordercolor attribute in the table tag. I know it has nothing to do with CSS and might turn future modifications in your site/application into a headache, but that's the only solution I know...
[ July 15, 2004: Message edited by: Pedro Penna ]
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

Originally posted by Bear Bibeault:
HACK ALERT! HACK ALERT! But this may do what you want:

1) Choose a cellspacing of 1
2) Set the background color of the table to black (or whatever)
3) Set the td backgrounds to white

The table background shows through the spacing around the cells.

I am so ashamed I know that.


that's actually not a bad idea. Thanks Bear.
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: Another table border question