I need to give space or break between two rows, so that my page will looks good.
if you look my code i had given many empty rows and column to make a space between t
According to the CSS box model:
margin values do not apply to table rows and table cells
See: http://www.w3.org/TR/CSS2/box.html#margin-properties
padding and border values do not apply to table rows but apply to table cells
See: http://www.w3.org/TR/CSS2/box.html#padding-properties
A quick fix is to add padding to the top of the row that you want to separate.
For example: http://jsfiddle.net/audetwebdesign/caXsZ/
Sample HTML:
<table cellpadding="0" cellspacing="0" border="0">
<tr class="row1">
<td>Row One - 1</td>
<td>Row One - 2</td>
</tr>
<tr class="row2">
<td>Row Two - 1</td>
<td>Row Two - 2</td>
</tr>
</table>
CSS:
td {
border: 1px dotted blue;
}
tr.row2 td {
padding-top: 40px;
}
If you want to style borders around your table cells, you may need to add wrappers around the content and apply borders depending on the design details.
The correct way to give spacing for tables is to use cellpadding and cellspacing e.g.
<table cellpadding="4">
or using css :
<style type='text/css'>
table{ border-collapse: separate; }
table td { border-spacing: 1em; }
</style>
Try this:
<tr>
<td>
Row 1
</td>
</tr>
<tr>
<td>
<!--you just need a space in a row-->
</td>
</tr>
<tr>
<td>
Row 2
</td>
</tr>
Set the margin
attribute for a <tr>
tag:
<tr style="margin-top:10px;"></tr>
Or make the entire table with this style:
<style>
table tr {
margin-top: 10px;
}
table tr:first-child {
margin-top: 0px; !important
}
</style>
This can be achieved like this.
<tr>
<td> <br> </td> <!--The br tag did what i was looking for -->
</tr>
border spacing attribute has to be specified in CSS
table
{
border-collapse:separate;
border-spacing:10px 0px;
}
The above code set 10px spacing between the rows and 0px spacing between the columns