468,107 Members | 1,303 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,107 developers. It's quick & easy.

Adding padding to tables

I am trying to add some padding to my table; that is, I want to add
space
between the red outer border and the content within. However, setting
the
"padding : 30px;" within the TABLE area of my CSS doesn't seem to be
having
any affect. Is there a way to add padding to a table via CSS?

I can use <table CELLSPACING=[n]>, but it's a rather coarse way of
doing
so. I would prefer to add more padding to the left and right of the
main table content, but keep the top and bottom with zero space
between it and the colored border. Any advice is greatly appreciated
-- thanks in advance!
-=Tek Boy=-
================================
Begin HTML Code
================================

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html><head><title>Testing</title>
<style>
<!--
BODY {
font-family : Arial,Verdana;
font-size : 10pt;
color : #000000;
background-color : #FFFFFF;
}

HR {
height : 1px;
width : 100%;
color : #000000;
}

FORM {
margin : 0.0em;
}

input[type=text] {
background-color : #CCCCCC;
color : #000000;
}

TABLE.form {
border : 1px solid #FF0000;
border-collapse : collapse;
background-color : #FFFFCC;
margin : 0.3em 0.0em 1.0em 0.0em;
width : 450px;
padding : 30px;
}

TABLE.form TD {
padding:0px;
}

//-->
</style></head>
<body>

<font face="Arial,Verdana" size="2">
<form name="OutOfBox" action="OutOfBox.asp" method="POST">
<input type="hidden" name="NotFirst_Step1" value="True">

<center><br>
Area above table.<br>

<table class="form" cellspacing="0">
<col width="10"><col width="5"><col width="200">
<tr><td>
<tr><td colspan="4"><font face="Arial" size="4"><b>Step 01 - QDR
Core
Information</b></font></td></tr>
<tr><td colspan="4"><hr></td></tr>
<tr>
<td nowrap>&nbsp;</td>
<td nowrap><font face="Times New Roman" size="2"
color="#FF0000">*</font></td>
<td nowrap><font face="Arial" size="2">Date</font></td>
<td><input type="text" value="01/01/2003" size="34"
maxlength="75"></td>
</tr>
<tr>
<td width="10" nowrap>&nbsp;</td>
<td nowrap><font face="Times New Roman" size="2"
color="#FF0000">*</font></td>
<td width="200" nowrap><font face="Arial"
size="2">Stufff</font></td>
<td width="100%" nowrap><input type="text" value="" size="34"
maxlength="75"></td>
</tr>
<tr><td colspan="4"><hr></td></tr>
<tr><td colspan="4" align="center">
<table cellpadding="5" cellspacing="0" border="0">
<tr>
<td><input type="button" value="Submit"></td>
<td width="20" nowrap>&nbsp;</td>
<td><input type="button" value="Reset Form"></td>
</tr>
</table>
</td></tr>
</table>

Area below table.<br>
</center>

</form>
</font>

</body></html>
Jul 20 '05 #1
1 15745
ve**********@hotmail.com (Saiyan Vejita) wrote:
Is there a way to add padding to a table via CSS?
You're actually asking how to put margins between the cells. The answer is
that this can be handled using the border-spacing property, but this
property is not supported e.g. by IE 6.
I can use <table CELLSPACING=[n]>, but it's a rather coarse way of
doing so.
Indeed, but it's mostly more practical at present.
I would prefer to add more padding to the left and right of the
main table content, but keep the top and bottom with zero space
between it and the colored border.
Put the table inside a <div> element, assign the border to the <div> and
not the <table>, and use padding properties for <div> or margin properties
for <table> to achieve the desired effect.
Begin HTML Code


In future, please post a URL instead.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Jul 20 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by Felipe Gasper | last post: by
10 posts views Thread by Alan Little | last post: by
3 posts views Thread by fx gamoy | last post: by
1 post views Thread by david.goodyear | last post: by
36 posts views Thread by phil-news-nospam | last post: by
2 posts views Thread by maya | last post: by
1 post views Thread by Jeff | last post: by
1 post views Thread by Solo | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.