Tycoon Talk
Become a Big fish!
The number 1 forum for online business!
Post topics, ask questions, share your knowledge.
Tycoon Talk is part of Freelancer.com - find skilled workers online at a fraction of the cost.

Website Design Forum


You are currently viewing our Website Design Forum as a guest. Please register to participate.
Login



Freelance Jobs

Reply
How to add a tic tac toe looking gridlines to a table
Old 06-04-2008, 10:13 PM How to add a tic tac toe looking gridlines to a table
pincushionboy's Avatar
Skilled Talker

Posts: 73
Name: Kieth
Location: Orlando, FL
Trades: 2
I am trying to add vertical & horizontal lines to a 9 item table that is dynamically created from a single table source. I know "who uses tables?", but this a dynamic switch that I don't want to mess with currently. What I would like is an end result like the image below, but I am finding it difficult to pull off. Does anyone have any suggestions? CSS / td style / use images, any help is appreciated. Thanks.

http://www.shopworldofdecor.com/imag...n/whatsnew.jpg
pincushionboy is offline
Reply With Quote
View Public Profile
 
 
Register now for full access!
Old 06-05-2008, 12:37 AM Re: How to add a tic tac toe looking gridlines to a table
vangogh's Avatar
Post Impressionist

Posts: 10,688
Name: Steven Bradley
Location: Boulder, Colorado
Trades: 0
It's doable with css.

Put a border (1px?) around the entire table. Give the cells the same border on two sides, say border-right and border bottom. That will create an unnecessary border for the rightmost and bottommost cells so you'd need to add a class to those cells so they don't get that border.

Alternately you could add the class to all the cells that get a border, but I think it will be less code to add the class to the cells that don't get it.

That should take care of everything other than the empty spaces between the cells and the table edge. I think what you want to do is create a row at the top and bottom and columns on the left and right. The rows would get colspan="5" and the columns would be rowspan="3" And none of these edge columns and rows gets a border.

I hope that makes sense. The main idea is to add classes to some of the cells so you can either turn borders on or off on those cells.
__________________
l Search Engine Friendly Web Design |
Please login or register to view this content. Registration is FREE

l Tips On Marketing, SEO, Design, and Development |
Please login or register to view this content. Registration is FREE

l
Please login or register to view this content. Registration is FREE
|
Please login or register to view this content. Registration is FREE
vangogh is offline
Reply With Quote
View Public Profile Visit vangogh's homepage!
 
Reply     « Reply to How to add a tic tac toe looking gridlines to a table
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML



Page generated in 0.12913 seconds with 12 queries