logo-dw

Go Back   Dreamweaver Club Forums > Hand Coders Forum > HTML and CSS
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 04-16-2006, 11:41 PM   #1
arrr_matey
 
Join Date: Apr 2006
Posts: 2
Default Table Gap Between Cells

Hi all...

I could really use some advice on a problem I'm having putting a site together. This seems like it shouldn't be difficult, so maybe I'm just overlooking something really simple?

I want to make a table with two cells, each with a different background colour. But the table always has a small gap between the two cells. I want the two colours to touch each other with no gap. How can I do this?

Below is a link to a visual example of my problem with a simple table with two colours and a white gap between them.

Thanks *very* much for any help.

http://www3.telus.net/public/chrislav/table.htm

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>

<body>
<table width="100%" >
<tr>
<td bgcolor="#660000">

</p>


</p>


</p></td>

<td bgcolor="#99CCcc"></td>
</tr>
</table>
</body>
</html>
arrr_matey is offline   Reply With Quote
Old 04-17-2006, 03:52 AM   #2
MissChankley
 
Join Date: Apr 2006
Posts: 1
Default this is simple!



Hi:

I am a fairly new developer myself, but I know what you're missing. Tables automatically default to cellspacing of 2 (cellpadding of 2 also). The reason your cells have a space between them is the cellspacing value. Just go into your table tag and specify cellspacing=0.
MissChankley is offline   Reply With Quote
Old 04-17-2006, 05:30 AM   #3
arrr_matey
 
Join Date: Apr 2006
Posts: 2
Default

Awesome! Thanks a million. That totally works.

Cheers
arrr_matey is offline   Reply With Quote
Old 04-17-2006, 01:39 PM   #4
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

a CSS version (valid and not deprecated) will work great as well:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Inert Your Title</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<style type="text/css">
<!-- 
table#ProductsTable, table#ProductsTable td {
	margin: 0;
	padding: 0;
	border: 0;
	width: 100%;
	border-collapse: collapse;
	}
td#ProductsPrice {background-color: #600;}
td#ProductsColor {background-color: #9cc;}
-->
</style>
</head>
<body>
<table id="ProductsTable">
	<tr>
		<td id="ProductsPrice">
			

</p>
			

</p>
			

</p>
		</td>
		<td id="ProductsColor">
			
		</td>
	</tr>
</table>
</body>
</html>
You'll see that the markup is cleaner than the normal HTML way of doing it, and I've seperated all the style information to the CSS.
domedia is offline   Reply With Quote
Reply


Thread Tools
Display Modes

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

Forum Jump


All times are GMT. The time now is 03:37 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com