Images in cURL email with HTML not resizing

I am currently trying to send an e-mail with cURL through SMTP. The body is a .txt containing the HTML. The inline attachments (in this case, images) are being inserted by converting them to base64 format standard RFC-2045. The images are all sent correctly (the whole email is), however, they are not being resized as it is specified in the style attribute.

The example of the image insert of the HTML is as below.

<img alt="" src="data:image/jpeg;base64, iVBORw0KGgoAAAANSUhE..." style="width:100px;"/>

I've already tried to set both width and height - either setting height to "auto" or calculating it through rule of three.

I have also tried using internal CSS like so, but didn't work:

<head>
    <style>
        #imgDisplay{
            width: 100px;
            height: auto;
        }
    </style>
</head>

<body>
<img id="imgDisplay" src="data:image/jpeg;base64, iVBORw0KGgoAAAANSUhE..."/>
</body>

I have little experience with HTML, so I'm not sure if I'm missing something, I've been searching an answer for hours but no success so far. I should also add that I am sending this email through FileMaker Pro Advanced 18 using its native cURL function. I have another email with a lot of HTML and attachments and it works perfectly, however, this is the first time I'm trying to send images in the body.

The full HTML is below:

<table>
    <tbody>
        <tr>
            <td style="text-align:center; width:120px"><span style="font-size:24px"><strong><span style="font-family:Arial,Helvetica,sans-serif"> name2 </span></strong></span></td>
            <td style="text-align:center; width:90px">&nbsp;</td>
            <td style="text-align:center; width:120px"><span style="font-size:24px"><strong><span style="font-family:Arial,Helvetica,sans-serif"> name2 </span></strong></span></td>
        </tr>
    </tbody>
</table>

<table>
    <tbody>
        <tr>
            <td>
            <table border="1" cellpadding="8" cellspacing="0" style="height:230px; width:105px;">
                <tbody>
                    <tr>
                        <td style="border-color:#000000; height:63px; text-align:center; vertical-align:middle; width:100px"><img alt="" src="data:image/jpeg;base64, iVBORw0KGgoAAAANSUhE..." style="width:100px;" /></td>
                    </tr>
                    <tr>
                        <td style="text-align:center"><span style="font-family:Arial,Helvetica,sans-serif"><span style="font-size:16px"><strong> value1 &euro;</strong></span></span></td>
                    </tr>
                    <tr>
                        <td style="text-align:center"><span style="font-family:Arial,Helvetica,sans-serif"><span style="font-size:16px"> value2 &euro;</span></span></td>
                    </tr>
                </tbody>
            </table>
            </td>
            <td style="vertical-align:top">
            <table cellpadding="12" style="height:230px;">
                <tbody>
                    <tr>
                        <td style="height:60px; text-align:center; vertical-align:middle; width:60px;"><span style="font-family:Arial,Helvetica,sans-serif"><img alt="" src="data:image/jpeg;base64, iVBORw0KGgoAAAANSUhE..." style="width:40px;height:40px" /></span></td>
                    </tr>
                    <tr>
                        <td style="text-align:center; vertical-align:middle"><span style="font-family:Arial,Helvetica,sans-serif"><span style="font-size:16px"><strong>M&ecirc;s</strong></span></span></td>
                    </tr>
                    <tr>
                        <td style="text-align:center; vertical-align:middle"><span style="font-family:Arial,Helvetica,sans-serif"><span style="font-size:16px"><strong>Ano</strong></span></span></td>
                    </tr>
                </tbody>
            </table>
            </td>
            <td>
            <table border="1" cellpadding="8" cellspacing="0" style="height:230px; width:105px;">
                <tbody>
                    <tr>
                        <td style="border-color:#000000; height:63px; text-align:center; vertical-align:middle; width:100px"><img alt="" src="data:image/jpeg;base64, iVBORw0KGgoAAAANSUhE..." style="width:100px;" /></td>
                    </tr>
                    <tr>
                        <td style="text-align:center"><span style="font-family:Arial,Helvetica,sans-serif"><span style="font-size:16px"><strong> value3 &euro;</strong></span></span></td>
                    </tr>
                    <tr>
                        <td style="text-align:center"><span style="font-family:Arial,Helvetica,sans-serif"><span style="font-size:16px"> value4 &euro;</span></span></td>
                    </tr>
                </tbody>
            </table>
            </td>
            <td>
            <table cellpadding="15" style="height:230px; width:105px">
                <tbody>
                    <tr>
                        <td style="height:63px; text-align:center">&nbsp;</td>
                    </tr>
                    <tr>
                        <td style="text-align:center"><span style="font-family:Arial,Helvetica,sans-serif"><span style="font-size:16px"><strong> diff1 &euro;</strong></span></span></td>
                    </tr>
                    <tr>
                        <td style="text-align:center"><span style="font-family:Arial,Helvetica,sans-serif"><span style="font-size:16px"> diff2 &euro;</span></span></td>
                    </tr>
                </tbody>
            </table>
            </td>
        </tr>
    </tbody>
</table>
        </tr>
    </tbody>
</table>

Thank you so much!

Solution

Try it with the <img> tag attributes width and height:

<img width="100" src="data:image/jpeg;base64, iVBORw0KGgoAAAANSUhE..."/>