Advertisement

02.21.2008 at 12:48AM PST, ID: 23180433
[x]
Attachment Details
[x]
The Solution Rating System

With so many solutions, how can you tell which solutions are most likely to help you and which ones are not? To provide you with a tool to use, we rate our solutions based on various elements that most accurately determine if a solution is a quality solution. To explain what factors affect the solution rating, here are the elements we take into consideration when formulating our solution rating.

  • The Grade of the Solution
  • The Zone Rank of the Expert Providing the Solution
  • The Number of Author and Expert Comments
  • The Number of Experts Contributing
  • The Feedback of the Community

Your Input Matters
Because of the way the system is set up, the most important variable in this equation is you. As a member of Experts Exchange, you are able to cast your vote on the quality of the solutions in regard to how complete, accurate, helpful and easy to understand each solution is. When you provide your feedback, each rating is adjusted accordingly. So, if you see a solution that has a poor rating that you think is a good solution, let us know by rating it. As you do, the rating will be adjusted and will become more accurate for other members of our site.

If you have any suggestions that you would like to make for our rating system, please ask a question in the Suggestions Zone of Community Support.

Thank you!

Putting a thin border around selected cells in a table

The code below represents two td's (cols 3 and 4)  in a tr of 9 columns. How would I could it so that I would get a thin border line around the perimeter of those two cells?  The perimeter only, not the vertical border between the two cells.  By thin I mean the equivalent of a 1px border around a div in CSS.

Thanks!

John
1:
2:
3:
4:
5:
6:
7:
8:
<td width="93" valign="top" bordercolor="#999999"><p><img src="http://images.dtdeals.com/store/thumb/DT_145216_1.jpg" alt="Acer Laptop" width="80" height="52" border="0" /></p>
        <p align="center" class="style7">Hot Item #1</p>
        <p align="center" class="style4"><a href="http://bestbuy.dtdeals.com/auction/index.cfm?P=4&amp;catlvl=2&amp;catid=51148" class="style6">view more <br />
        like this</a></p>
        </td>
      <td width="250" valign="top" bordercolor="#999999"><p><strong><span class="style1"><a href="http://Bestbuy.dtdeals.com/auction/index.cfm?P=5&amp;I=142439" class="style2">Acer EX5620-6830 Laptop 1.5GHz 1GB 200GB DL DVDRW WiFi</a></span></strong></p>
        <p><span class="style4 style1">Enjoy complete wireless integration and blazing-fast performance with this Intel Centrino Duo-equipped laptop. Connect to your home network or local hotspots and use the integrated Web cam and microphone to chat with friends and family</span><span class="style4">.</span><strong><a href="http://Bestbuy.dtdeals.com/auction/index.cfm?P=5&amp;I=142439" class="style2"><br />
          </a></strong></p></td>
Start your free trial to view this solution
Question Stats
Zone: Web Development
Question Asked By: gabrielPennyback
Solution Provided By: TName
Participating Experts: 1
Solution Grade: A
Views: 42
Translate:
Loading Advertisement...
02.21.2008 at 12:59AM PST, ID: 20946058

Rank: Wizard

All comments and solutions are available to Premium Service Members only.

Start your 7 day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
02.21.2008 at 01:06AM PST, ID: 20946098

Rank: Wizard

All comments and solutions are available to Premium Service Members only.

Start your 7 day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
02.21.2008 at 01:40PM PST, ID: 20952132

All comments and solutions are available to Premium Service Members only.

Start your 7 day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
02.21.2008 at 02:02PM PST, ID: 20952324

Rank: Wizard

All comments and solutions are available to Premium Service Members only.

Start your 7 day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
 
Loading Advertisement...
Microsoft
  • Internet Protocols
  • Applications
  • Development
  • OS
  • Hardware
  • Windows Security
Apple
  • Operating Systems
  • Hardware
  • Programming
  • Networking
  • Software
Internet
  • Search Engines
  • File Sharing
  • WebTrends / Stats
  • Spy / Ad Blockers
  • Web Browsers
  • New Net Users
  • Web Development
  • Chat / IM
  • Anti Spam
  • Web Servers
  • Anti-Virus
  • Email Clients
Gamers
  • Tips
  • Online / MMORPG
  • Puzzle
  • Emulators
  • Action / Adventure
  • Role Playing
  • Consoles
  • Game Programming
  • Strategy
  • Sports
  • Misc
  • Computer Games
Digital Living
  • Hardware
  • New Net Users
  • New Users
  • Software
  • Digital Music
  • Gaming World
  • Home Security
  • Apple
  • Networking Hardware
Virus & Spyware
  • Vulnerabilities
  • IDS
  • Encryption
  • Anti-Virus
  • Operating Systems Security
  • Software Firewalls
  • WebApplications
  • Cell Phones
  • Operating Systems
  • Internet
  • Hardware Firewalls
Hardware
  • Handhelds / PDAs
  • Displays / Monitors
  • Components
  • Networking Hardware
  • Peripherals
  • Laptops/Notebooks
  • Storage
  • Servers
  • Desktops
  • New Users
  • Misc
  • Apple
Software
  • System Utilities
  • Industry Specific
  • Network Management
  • Photos / Graphics
  • Page Layout
  • VMWare
  • Misc
  • Web Development
  • OS
  • CYGWIN
  • Voice Recognition
  • Message Queue
  • Quality Assurance
  • Security
  • Firewalls
  • MultiMedia Applications
  • Development
  • Database
  • Office / Productivity
  • Business Management
  • OS/2 Apps
  • Server Software
  • Internet / Email
ITPro
  • OS
  • Storage
  • Encryption
  • Operating Systems Security
  • Apple Hardware
  • Laptops & Notebooks
  • Servers
  • Networking Hardware
  • Peripherals
  • Devices
  • Displays / Monitors
  • WebTrends / Stats
  • Search Engines
  • Firewalls
  • WebApplications
  • IDS
  • Vulnerabilities
  • Email Clients
  • File Sharing
  • Spy / Ad Blockers
  • Web Browsers
  • Web Servers
  • Networking
  • Anti-Virus
  • Chat / IM
  • Anti Spam
Developer
  • Web Servers
  • Web Browsers
  • Game Programming
  • Dev Tools
  • Industry Specific
  • Office / Productivity
  • Database
  • CYGWIN
  • Web Development
  • Search Engines
  • File Sharing
  • WebTrends / Stats
  • Programming
  • Content Management
  • Application Servers
  • Protocols
Storage
  • Removable Backup Media
  • Storage Technology
  • Servers
  • Grid
  • Remote Access
  • Backup / Restore
  • Misc
  • Hard Drives
OS
  • Miscellaneous
  • Security
  • Development
  • Linux
  • VMWare
  • MainFrame OS
  • Unix
  • Apple
  • OS / 2
  • AS / 400
  • BeOS
  • Microsoft
  • VMS / OpenVMS
Database
  • Oracle
  • Miscellaneous
  • MySQL
  • Software
  • Sybase
  • Contact Management
  • PostgreSQL
  • Data Manipulation
  • Clarion
  • InterSystems Cache
  • Siebel
  • MUMPS
  • OLAP
  • SQLBase
  • SAS
  • GIS & GPS
  • 4GL
  • Berkeley DB
  • DB2
  • Informix
  • Interbase / Firebird
  • FoxPro
  • Reporting
  • LDAP
  • Filemaker Pro
  • MS SQL Server
  • dBase
  • MS Access
Security
  • Misc
  • Web Browsers
  • Software Firewalls
  • Operating Systems Security
  • File Sharing
  • Spy / Ad Blockers
  • Vulnerabilities
  • WebApplications
  • IDS
  • Anti-Virus
  • Encryption
  • Anti Spam
  • Email Clients
  • VPN
  • Chat / IM
Programming
  • Editors IDEs
  • Installation
  • Handhelds / PDAs
  • Multimedia Programming
  • System / Kernel
  • Algorithms
  • Game
  • Signal Processing
  • Project Management
  • Open Source
  • Database
  • Misc
  • Languages
  • Processor Platforms
  • Theory
Web Development
  • Scripting
  • Blogs
  • Web Servers
  • Software
  • Search Engines
  • Web Graphics
  • Images
  • Internet Marketing
  • Images and Photos
  • Components
  • Document Imaging
  • Web Languages/Standards
  • Illustration
  • WebApplications
  • Fonts
  • WebTrends / Stats
  • Authoring
  • Digital Camera Software
  • Miscellaneous
Networking
  • Protocols
  • Apple Networking
  • Network Management
  • Message Queue
  • Application Servers
  • Content Management
  • File Servers
  • Email Servers
  • Misc
  • Java Editors & IDEs
  • Wireless
  • Networking Hardware
  • Backup / Restore
  • System Utilities
  • ISPs & Hosting
  • Web Servers
  • Storage Technology
  • Removable Backup Media
  • Servers
  • Broadband
  • Grid
  • OS / 2
  • Novell Netware
  • Unix Networking
  • Windows Networking
  • Security
  • Telecommunications
  • Operating Systems
  • Linux Networking
Other
  • Community Advisor
  • Lounge
  • Community Support
  • New Net Users
  • Philosophy / Religion
  • Math / Science
  • Miscellaneous
  • URLs
  • Expert Lounge
  • Politics
  • Puzzles / Riddles
Community Support
  • Suggestions
  • New to EE
  • New Topics
  • Community Advisor
  • CleanUp
  • Announcements
  • General
  • Feedback
  • Input
  • EE Bugs
 
02.21.2008 at 12:59AM PST, ID: 20946058

Rank: Wizard

Hi, I would define classes for the left and the right cell and draw the borders individually (top, left, right...). See example below:
You could also define a third class for middle cells (top and bottom border only)
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style>
td.tdL { 
border-left:1px solid #f00;
border-top:1px solid #f00;
border-bottom:1px solid #f00;
 }
td.tdR { 
border-right:1px solid #f00;
border-top:1px solid #f00;
border-bottom:1px solid #f00;
 }   
</style>
</head>
<body>
<table border="0">
<tr style="background-color:#fff;">
<td>aaa</td>
<td>bbb</td>
<td>ccc</td>
<td class="tdL" width="93" valign="top" bordercolor="#999999"><p><img src="http://images.dtdeals.com/store/thumb/DT_145216_1.jpg" alt="Acer Laptop" width="80" height="52" border="0" /></p>
        <p align="center" class="style7">Hot Item #1</p>
        <p align="center" class="style4"><a href="http://bestbuy.dtdeals.com/auction/index.cfm?P=4&amp;catlvl=2&amp;catid=51148" class="style6">view more <br />
        like this</a></p>
        </td>
<td class="tdR" width="250" valign="top" bordercolor="#999999"><p><strong><span class="style1"><a href="http://Bestbuy.dtdeals.com/auction/index.cfm?P=5&amp;I=142439" class="style2">Acer EX5620-6830 Laptop 1.5GHz 1GB 200GB DL DVDRW WiFi</a></span></strong></p>
        <p><span class="style4 style1">Enjoy complete wireless integration and blazing-fast performance with this Intel Centrino Duo-equipped laptop. Connect to your home network or local hotspots and use the integrated Web cam and microphone to chat with friends and family</span><span class="style4">.</span><strong><a href="http://Bestbuy.dtdeals.com/auction/index.cfm?P=5&amp;I=142439" class="style2"><br />
          </a></strong></p></td>
<td>xxx</td>
<td>yyy</td>
<td>zzz</td>		  
</tr>
  
		  
</table>
</body>
</html>
Open in New Window
 
02.21.2008 at 01:06AM PST, ID: 20946098

Rank: Wizard

If you see any tiny gap, you could collapse the table borders (and maybe increase the padding for the TDs)

table { border-collapse:collapse; }
td { padding:4px; }
 
02.21.2008 at 01:40PM PST, ID: 20952132
Hi TName,

I think that should work, but if you don't mind my changing direction her, it turns out that what I need to do is put left and right borders on the table itself.
Actually I've got 7 tables of identical width stacked on top of each other (for some reason that seemed better than one table with seven rows. If I can put left and right borders around them (with a bottom border on the bottom table, then it should work.
I couldn't figure out how to adapt your answer, so if you could spell that out for me, I'd really appreciate it.

I guess another option would be to wrap a  one cell table around all ot them, but i'm not quite sure how to do that.

Thanks,

John
 
02.21.2008 at 02:02PM PST, ID: 20952324

Rank: Wizard

You can simply set only the left and right CSS borders for the table itself.
Here's an example with 2 tables, the only difference between them is that the upper table has only the class .borderLR (defined with borders left and right) and the lower table also has the class .borderBottom :
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style>
body { padding:20px; }
 
table.borderLR  { 
    border-left:1px solid #f00;
	border-right:1px solid #f00;
 }   
 table.borderBottom  { 	
    border-bottom:1px solid #f00;
 }   
 
</style>
</head>
<body>
<table class="borderLR " border="0">
<tr style="background-color:#fff;">
<td>aaa</td>
<td>bbb</td>
<td>ccc</td>
<td width="93" valign="top" bordercolor="#999999"><p><img src="http://images.dtdeals.com/store/thumb/DT_145216_1.jpg" alt="Acer Laptop" width="80" height="52" border="0" /></p>
        <p align="center" class="style7">Hot Item #1</p>
        <p align="center" class="style4"><a href="http://bestbuy.dtdeals.com/auction/index.cfm?P=4&amp;catlvl=2&amp;catid=51148" class="style6">view more <br />
        like this</a></p>
        </td>
<td width="250" valign="top" bordercolor="#999999"><p><strong><span class="style1"><a href="http://Bestbuy.dtdeals.com/auction/index.cfm?P=5&amp;I=142439" class="style2">Acer EX5620-6830 Laptop 1.5GHz 1GB 200GB DL DVDRW WiFi</a></span></strong></p>
        <p><span class="style4 style1">Enjoy complete wireless integration and blazing-fast performance with this Intel Centrino Duo-equipped laptop. Connect to your home network or local hotspots and use the integrated Web cam and microphone to chat with friends and family</span><span class="style4">.</span><strong><a href="http://Bestbuy.dtdeals.com/auction/index.cfm?P=5&amp;I=142439" class="style2"><br />
          </a></strong></p></td>
<td>xxx</td>
<td>yyy</td>
<td>zzz</td>              
</tr>                 
</table>
 
 
 
<table class="borderLR  borderBottom" border="0">
<tr style="background-color:#fff;">
<td>aaa</td>
<td>bbb</td>
<td>ccc</td>
<td width="93" valign="top" bordercolor="#999999"><p><img src="http://images.dtdeals.com/store/thumb/DT_145216_1.jpg" alt="Acer Laptop" width="80" height="52" border="0" /></p>
        <p align="center" class="style7">Hot Item #1</p>
        <p align="center" class="style4"><a href="http://bestbuy.dtdeals.com/auction/index.cfm?P=4&amp;catlvl=2&amp;catid=51148" class="style6">view more <br />
        like this</a></p>
        </td>
<td width="250" valign="top" bordercolor="#999999"><p><strong><span class="style1"><a href="http://Bestbuy.dtdeals.com/auction/index.cfm?P=5&amp;I=142439" class="style2">Acer EX5620-6830 Laptop 1.5GHz 1GB 200GB DL DVDRW WiFi</a></span></strong></p>
        <p><span class="style4 style1">Enjoy complete wireless integration and blazing-fast performance with this Intel Centrino Duo-equipped laptop. Connect to your home network or local hotspots and use the integrated Web cam and microphone to chat with friends and family</span><span class="style4">.</span><strong><a href="http://Bestbuy.dtdeals.com/auction/index.cfm?P=5&amp;I=142439" class="style2"><br />
          </a></strong></p></td>
<td>xxx</td>
<td>yyy</td>
<td>zzz</td>              
</tr>                 
</table>
 
</body>
</html>
Open in New Window
Accepted Solution
 
 
02.26.2008 at 10:33AM PST, ID: 20987204
Thanks!
 
 
 
20080236-EE-VQP-29 / EE_QW_2_20070628