Static File Whitenoise Heroku Django issue - django

Question

I have an API developed in Django and Django Rest Framework. We need one page in "normal" Django that will be open once a month maybe (so no need for CDN for the static files). Gunicorn + whitenoise is what we went ahead with.
The collectstatic works fine in both build phase and after build phase.
The url generated on the page is href=/static/css/edit_card.a1c6e0f9f12e.css/ but the console shows the 404 not found for that resource and there are no styles applied to the page.
Relevant django settings:
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.10/howto/static-files/
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static_media/')
STATICFILES_DIRS = [
os.path.join(BASE_DIR + "/static_folder/"),
]
STATICFILES_STORAGE = 'whitenoise.storage.CompressedManifestStaticFilesStorage'
The relevant file in the repo is in /static_folder/css/edit_card.css
The relevant file on the heroku instance after running collectstatic is in
static_media/css/edit_card.a1c6e0f9f12e.css (together with the normal version and other compressed files)
I can manually access this link url/static/css/edit_card.css which is ridiculously weird.
This works fine when DEBUG = True. When in False/production it does not.
Could someone point me in the right direction? Thanks.
EDIT:
Template
{% load static %}
<link rel="stylesheet" type="text/css" href={% static "css/edit_card.css" %}/>

Answer 1

It might be too late for this response, but I'm surprised nobody noticed the error.
Your template is as follows:
<link rel="stylesheet" type="text/css" href={% static "css/edit_card.css" %}/>
The problem is that the href attribute is not quoted and it's taking the last / as part of the path. That's why the URL is: href=/static/css/edit_card.a1c6e0f9f12e.css/ (note the / at the end).
The solution would be:
<link rel="stylesheet" type="text/css" href="{% static "css/edit_card.css" %}" />
URL is between quotes and there's a space after the path.