homepage Welcome to WebmasterWorld Guest from 54.237.98.229
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

    
Extra space in table rows
timware

10+ Year Member



 
Msg#: 4108664 posted 1:14 am on Apr 2, 2010 (gmt 0)

Hello,

How do i get rid of extra space above and below divs within table rows? I have a background color set for <td>s and white divs appear inside the <td>s. Somehow the background color peeks through above and below the divs. How do I get rid of the extra space without giving the td a height setting? (Note: removing the background color is not optional). Thanks.

My code:


<html>
<head>
<style>

table {
border-collapse: collapse;
border-spacing: 0;
vertical-align: top;
border: 1px solid #b8b9b4;
padding: 0;
margin: 0;
}

table tr {
margin: 0;
padding: 0;
}

table td {
vertical-align: top;
border-left: 1px solid #b8b9b4;
padding: 3px 0;
background-color: #e4e0d7;
}

table td div {
overflow: hidden;
margin: 0;
padding: 4px 10px 0;
height: 20px;
text-align: center;
background-color: #fff;
border-bottom: 1px solid #b8b9b4;
}

</style>
</head>
<body>

<table cellpadding="0" cellspacing=0">
<tr><td><div>Fri 04/02</div></td><td><div>Sat 04/03</div></td><td><div>Sun 04/04</div></td><td><div>Mon 04/05</div></td><td><div>Tue 04/06</div></td><td><div>Wed 04/07</div></td><td><div>Thu 04/08</div></td></tr>
</table>
</body>
</html>

 

tedster

WebmasterWorld Senior Member tedster us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 4108664 posted 3:46 am on Apr 2, 2010 (gmt 0)

Without complete testing, I suspect that extra space comes from the padding that you've assigned to the td element.

tangor

WebmasterWorld Senior Member tangor us a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



 
Msg#: 4108664 posted 7:56 am on Apr 2, 2010 (gmt 0)

Delete the padding in td, tedster is correct.

timware

10+ Year Member



 
Msg#: 4108664 posted 5:30 pm on Apr 2, 2010 (gmt 0)

You guys are absolutely right. I've been staring at this code for so long (extracted from a a page I've been working on) that I overlooked the obvious. Thanks.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved