-1

I created a flyer on Photoshop to send as a newsletter. So I used the slice tool to link certain parts of the flyer. When I sent a sample to my email, there are white lines around the images I linked and it's uneven.

Is there a way to prevent this? The reason I use Photoshop and Dreamweaver is because I have seen people do it and they did have any problems. I'm using MailChimp to create the newsletter. Here's a sample:

enter image description here

This link will show you the code:

http://ovh.to/W1JCWdL

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>centralvet</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (centralvet.psd) -->
<table id="Table_01" width="640" height="1101" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td rowspan="2">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/b5bc9873-e775-4e82-bf4f-01c714cb5560.jpg" width="2" height="583" alt=""></td>
        <td colspan="12">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/144f8a3c-13cf-4d1d-8b70-e53bcc233d35.jpg" width="638" height="184" alt=""></td>
    </tr>
    <tr>
        <td colspan="12">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/d2e0c53a-5338-4614-947d-28d77fbf9cf3.jpg" width="638" height="399" alt=""></td>
    </tr>
    <tr>
        <td colspan="4">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/d0f71e0f-9738-4eea-8400-66aa358d73bf.jpg" width="219" height="241" alt=""></td>
        <td colspan="4" rowspan="2">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/dfaf7625-45d6-4b7c-9545-7280824c27cb.jpg" width="162" height="242" alt=""></td>
        <td colspan="5" rowspan="2">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/c874f5e1-deb6-4187-9055-c1ead57f3bbc.jpg" width="259" height="242" alt=""></td>
    </tr>
    <tr>
        <td colspan="4">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/dbc719b5-4000-48fb-b11a-098f78c8a8d4.jpg" width="219" height="1" alt=""></td>
    </tr>
    <tr>
        <td colspan="11">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/96e9e528-bbab-4428-8c20-c4619a9707bc.jpg" width="485" height="109" alt=""></td>
        <td colspan="2" rowspan="2">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/2c94ab34-142b-4527-b4a1-3e66ffcd116f.jpg" width="155" height="205" alt=""></td>
    </tr>
    <tr>
        <td colspan="11">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/e35153be-96fa-44ff-8194-46bb12be47fe.jpg" width="485" height="96" alt=""></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="2">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/eb4a85f0-6d4c-41f7-9117-17480aeb21bc.jpg" width="107" height="70" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/99256d59-7798-4e83-9522-2de4aabfb78b.jpg" width="60" height="57" alt=""></td>
        <td colspan="2">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9811d032-99fa-4de5-a2c0-264cd1ced4ec.jpg" width="60" height="57" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/7e8d0924-17c3-4d71-92e2-9367ecbdd057.jpg" width="60" height="57" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/0859cba1-6166-47d2-8d9d-32338b662047.jpg" width="61" height="57" alt=""></td>
        <td colspan="2">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/3afa507c-22d8-47b3-b256-f248c4c0afe1.jpg" width="60" height="57" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/13cf7a46-f84e-476f-ad87-f5c939f2d260.jpg" width="60" height="57" alt=""></td>
        <td colspan="2">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/49e2d4f6-022c-4d69-a3cf-378c69766ac3.png" width="60" height="57" alt=""></td>
        <td rowspan="2">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/ad637be3-2aab-426f-8237-84563ae7b0e2.jpg" width="112" height="70" alt=""></td>
    </tr>
    <tr>
        <td colspan="10">
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/eb4247c8-6255-42aa-896e-ba418600f119.jpg" width="421" height="13" alt=""></td>
    </tr>
    <tr>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="2" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="105" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="60" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="52" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="8" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="60" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="61" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="33" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="27" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="60" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="17" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="43" height="1" alt=""></td>
        <td>
            <img src="https://gallery.mailchimp.com/921d758dc251f28d1ad7def28/images/9435ebf6-93d9-499a-8d68-825084118757.gif" width="112" height="1" alt=""></td>
    </tr>
</table>
<!-- End Save for Web Slices -->
            <center>
                <br>
                <br>
                <br>
                <br>
                <br>
                <br>
                <table border="0" cellpadding="0" cellspacing="0" width="100%" id="canspamBarWrapper" style="background-color:#FFFFFF; border-top:1px solid #E5E5E5;">
                    <tr>
                        <td align="center" valign="top" style="padding-top:20px; padding-bottom:20px;">
                            <table border="0" cellpadding="0" cellspacing="0" id="canspamBar">
                                <tr>
                                    <td align="center" valign="top" style="color:#606060; font-family:Helvetica, Arial, sans-serif; font-size:11px; line-height:150%; padding-right:20px; padding-bottom:5px; padding-left:20px; text-align:center;">
                                        This email was sent to <a href="mailto:*|EMAIL|*" target="_blank" style="color:#404040 !important;">*|EMAIL|*</a>
                                        <br>
                                        <a href="*|ABOUT_LIST|*" target="_blank" style="color:#404040 !important;"><em>why did I get this?</em></a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="*|UNSUB|*" style="color:#404040 !important;">unsubscribe from this list</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="*|UPDATE_PROFILE|*" style="color:#404040 !important;">update subscription preferences</a>
                                        <br>
                                        *|LIST:ADDRESSLINE|*
                                        <br>
                                        <br>

                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
                <style type="text/css">
                    @media only screen and (max-width: 480px){
                        table#canspamBar td{font-size:14px !important;}
                        table#canspamBar td a{display:block !important; margin-top:10px !important;}
                    }
                </style>
            </center></body>
</html>
6
  • Hi shinotenshi, we cannot give you a valid answer without seeing the code. Are you using a service like Constant Contact? CC adds "hspace" to its images. – AndrewH Apr 28 '17 at 16:53
  • This is more an issue with the HTML than Photoshop. You have something in the markup which is resulting in spacing between image slices. – Scott Apr 28 '17 at 17:03
  • As others have said though, this will be a issue with the HTML so it's going do be difficult for anyone to answer without seeing that. – Cai Apr 28 '17 at 17:20
  • Hi Shinotenshi, by request I unlocked this one and locked the other. However, please use this form to merge your accounts - its not something moderators can do or I would. graphicdesign.stackexchange.com/help/merging-accounts – Ryan Apr 28 '17 at 18:08
  • @shinotenshi here is a link to the other account if you need it to merge accounts: graphicdesign.stackexchange.com/users/93177 – Cai Apr 28 '17 at 18:20
0

There is a much better write up about your issue on StackOverflow Image inside div has extra space below the image

What you need to do is add display block to your images.

A simple way to add this to all your images is to write:

<style>
td img {
  display: block;
}
</style>
<table>(rest of code)</table>

Click here for example

Insert that code into a CSS inline tool like MailChimps CSS Inliner Tool

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.