Changing port for dunglas symfony-docker

I have been given a site to work with using https://github.com/dunglas/symfony-docker

All looks good, apart from I usually have 3 or 4 sites at one time in development, so I would usually in my docker-compose files set different ports for various services so they don't clash, for example:

nginx:
    build: docker/nginx
    ports:
      - 97:80

However in this I don't seem to be able to change it, I am not sure if it is because of the caddy communication (first time using it, usually use nginx)

I tried setting different ports in the docker-compose.yml such as

caddy:
    ports:
      # HTTP
      - target: 80
        published: 97
        protocol: tcp
      # HTTPS
      - target: 443
        published: 8083
        protocol: tcp
      # HTTP/3
      - target: 443
        published: 8083
        protocol: udp

But this just kept giving server 502 errors.

If I turn off all my other Docker containers I can get it working, so I know it is a port issue.

Does anyone familiar with this Docker setup know what I could be doing wrong? Maybe thinking it doesn't like non 443 port for it's self signed security cert? I did notice if I visit http://localhost:97 it redirected me to https://localhost (no port). However if I visit https://localhost:8083 I would get the 502 error

I also needed to use custom port in my project so i modified the caddy env var from:

  caddy:
    environment:
      SERVER_NAME: ${SERVER_NAME:-localhost, caddy:80}

(comes with the repo) to:

  caddy:
    environment:
      SERVER_NAME: ${SERVER_NAME:-http://localhost:80, https://localhost:443}

in the docker-compose file. Also as Blackban suggested you also need to check outer ports conflict and firewall.