Help with tag

Asked Nov 23 '20 at 23:09

Active Nov 24 '20 at 00:04

Viewed 47 times

-2

I have the following code

<table style="width: 100%;"> <tbody> <tr> <td style="width: 50%; border:1px solid #ccc!important; border-color:#000!important;"><span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 10px;"><em>Previous editions are obsolete</em></span></span></td> <td style="width: 50%; border:1px solid #ccc!important; border-color:#000!important;"> <div style="text-align: right;"><span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 10px;">Credit Union Name:</span></span></div> </td> </tr> </tbody> </table>

in the output I am seeing gap between two table. Can anyone help me how to remove the gap between the two table.

html

asked Nov 23 '20 at 23:09
Tamil

97

1

3

you can post this question on stackoverflow – harshikerfuffle Nov 24 '20 at 05:19

it's a margin issue. Tables add margin and padding by default. you have to set it to 0 – Mayo Dec 09 '20 at 14:00

2 Answers2

1

This is not a gap between two tables but between the two cells of your table. You can easily remove that (or modify it) by adding `border-spacing: 0` to the table style.

By the way, I would also remove the `<div>` from inside the second cell. If you really need a block element there, you can use `display: block`.

answered Nov 23 '20 at 23:59
Ángel

388

2

8

1

You can also remove the gap by setting the border-collapse: collapse to the table style.

answered Nov 24 '20 at 00:04
Chris Griffith

479

2

3

Question

I have the following code

<table style="width: 100%;">
    <tbody>
        <tr>
            <td style="width: 50%; border:1px solid #ccc!important; border-color:#000!important;"><span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 10px;"><em>Previous editions are obsolete</em></span></span></td>
            <td style="width: 50%; border:1px solid #ccc!important; border-color:#000!important;">
            <div style="text-align: right;"><span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 10px;">Credit Union Name:</span></span></div>
            </td>
        </tr>
    </tbody>
</table>

in the output I am seeing gap between two table. Can anyone help me how to remove the gap between the two table.

it's a margin issue. Tables add margin and padding by default. you have to set it to 0 — Mayo, Dec 09 '20 at 14:00

score 1 · Answer 1 · answered Nov 23 '20 at 23:59

This is not a gap between two tables but between the two cells of your table. You can easily remove that (or modify it) by adding border-spacing: 0 to the table style.

By the way, I would also remove the <div> from inside the second cell. If you really need a block element there, you can use display: block.

score 1 · Answer 2 · answered Nov 24 '20 at 00:04

1

You can also remove the gap by setting the border-collapse: collapse to the table style.

answered Nov 24 '20 at 00:04

Chris Griffith

479
2
3