CODEWITHSUNDEEP
htmlcsshtml-table
Jaanus
Jaanus

Reputation: 16561

Removing spacing between TD elements

There are annoying gap between my td elements. I want it to be joined together.

http://jsfiddle.net/zj6mk/4/

I have tried different elements, but none have worked:

 border-collapse:collapse;
 cellspacing:0;
 border-spacing:0;

Upvotes: 0

Views: 366

Answers (4)

gusaindpk
gusaindpk

Reputation: 1253

<table style="height: 400px; width: 100%;">
<tr>
    <td style="vertical-align: top;padding:0px">
        <div style="height: 200px;">aa</div>
        <div style="height: 200px;">aa</div>
    </td>
    <td style="vertical-align: top;padding:0px">
        <div style="height: 350px;">aa</div>
        <div style="height: 50px;">aa</div>
    </td>
</tr>

try adding padding:0px to td

Upvotes: -1

DominikAngerer
DominikAngerer

Reputation: 6530

Using this:

<table style="height: 400px; width: 100%;" cellpadding="0" cellspacing="0">
<tr>
    <td style="vertical-align: top;">
        <div style="height: 200px;">aa</div>
        <div style="height: 200px;">aa</div>
    </td>
    <td style="vertical-align: top;cellspacing:0;">
        <div style="height: 350px">aa</div>
        <div style="height: 50px">aa</div>
    </td>
</tr>

As you can see I added cellpadding="0" & cellspacing="0" and the gap disappears.

Here the JsFiddle for you: http://jsfiddle.net/zj6mk/7/

Or simpler and more "attractive" - use width:100%; in your css for your div.

Upvotes: 0

Sajad Karuthedath
Sajad Karuthedath

Reputation: 15837

add

html,body{

    margin:0;
    padding:0;
}

so outer white spaces will be removed and 

<table style="height: 400px; width: 100%;" cellspacing="0" cellpadding="0">

so inner white spaces will be removed FIDDLE

Upvotes: 0

Nitish Kumar
Nitish Kumar

Reputation: 4870

Add cellspacing="0" cellpadding="0" to table

<table style="height: 400px; width: 100%;" cellspacing="0" cellpadding="0">

See Demo

Upvotes: 3

Related Questions