IIS loading image resources fails using non-standard Port

I have a PHP web application hosted in IIS. The problem I have is that some image resources can't be loaded because I'm using a non-standard port 81. But in developer tools I can see that the GET Request using the default port 80.

There are 2 rules already in the web.config but I'm not sure for what purpose.

<rules>
    <rule name="Imported Rule 1" stopProcessing="true">
        <match url="^.*$" />
        <conditions logicalGrouping="MatchAny">
            <add input="{REQUEST_FILENAME}"
                 matchType="IsFile" pattern=""
                 ignoreCase="false" />
            <add input="{REQUEST_FILENAME}"
                 matchType="IsDirectory"
                 pattern=""
                 ignoreCase="false" />
        </conditions>
        <action type="None" />
    </rule>
    <rule name="Imported Rule 2" stopProcessing="true">
        <match url="^.*$" />
        <action type="Rewrite" url="index.php" />
    </rule>
</rules>

How can I make this work with any port bound to the webapp?

EDIT:

Here is what I get in the FailedReqLogs:

ModuleName IIS Web Core 
Notification 16 
HttpStatus 404 
HttpReason Not Found 
HttpSubStatus 0 
ErrorCode 2147942402 
ConfigExceptionInfo  
Notification MAP_REQUEST_HANDLER 
ErrorCode The system cannot find the file specified. (0x80070002) 

Check the code of your HTML.

If it's referencing a FQDN without the extra port added then that will be your problem. You shouldn't hardcode anything