What's new
HTML Forums | An HTML and CSS Coding Community

Welcome to HTMLForums; home of web development discussion! Please sign in or register your free account to get involved. Once registered you will be able to connect with other members, send and receive private messages, reply to topics and create your very own. Our registration process is hassle-free and takes no time at all!

Problems removing the gap on top of a table

RS!

New member
Hello, can anyone help me remove the black outline gap around the image? I have had multiple attempts but can't get rid of it!

Thanks in advance

1706547631647.png


HTML:
<p></p>
<style>
    body {
        margin: 0;
        padding: 0;
        background-color: #e7f0f5;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
    }

    table {
        max-width: 600px;
        width: 100%;
        background-color: #FFFFFF;
        margin: 0;
    }

    .header-image-cell,
    .footer-image-cell {
        padding: 0;
        margin: 0;
        background-color: #FFFFFF;
    }

    .header-image,
    .footer-image {
        width: 100%;
        height: auto;
        display: block;
        margin: 0;
    }

    .content-cell {
        color: #303a46;
        text-align: left;
        font-size: 16px;
        padding: 25px 30px;
    }

    .content-cell p {
        font-family: arial, helvetica, sans-serif;
        font-size: 10pt;
        margin: 0;
    }
</style>
<table cellpadding="0" cellspacing="0" border="0" align="center">
<tbody>
<tr style="height: 62px;"><!-- Set the height to match the image height -->
<td class="header-image-cell">
<table width="100%" style="text-align: center; margin: 0;">
<tbody>
<tr>
<td style="color: #ffffff; text-align: left; padding: 0; margin: 0;"><img class="header-image" src="/sys_attachment.do?sys_id=d34014db1b2775902862b455464bcb3a" title="Incident_960x85.png" width="700" height="62" alt="" data-library="false" /></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr style="height: 90.2131px;">
<td class="content-cell">
<table width="100%" style="text-align: left;">
<tbody>
<tr>
<td style="padding: 0;">
<p class="p1">${notification:body}</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr style="height: 32px;"><!-- Set the height to match the image height -->
<td class="footer-image-cell">
<table width="100%" style="text-align: left; margin: 0;">
<tbody>
<tr>
<td style="color: #303a46; text-align: left; font-size: 16px; padding: 0px; margin: 0px;"><img class="footer-image" src="/sys_attachment.do?sys_id=f950541f1b2775902862b455464bcb6b" title="FOOTER_960x43.png" width="700" height="32" alt="" data-library="false" /></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
 
Back
Top