Troubleshooting Styled Media Receiver css

Question

I'm trying to implement styled media receiver, but for some reason, my chromecast won't show the graphics. I get only name of my receiver on black background. Preview in cast dev console looks OK though. The css I'm trying to use is this: https://krizan.se/styl_latest.css

What I tried and did not help:

• CORS enabled and disabled, doesn't make a difference. Left it enabled. Verified by streaming video from the server on chromecast
• I tried using both absolute and relative paths for images, no change.
• Tried using both http and https, no change either.
• The image I'm using is 1280x720, as in guidelines. Tried changing it to different sizes, no change
• Remove and register my chromecast again in dev console, no change

I spent too many hours trying to fix this, trying all combinations of above, but still can't see my graphics on my cast device. There was one question on stackoverflow with the same issue, but without answer.

Is this some kind of bug or am I doing something wrong? Any help greatly appreciated.

Answer 1

You don't appear to have a valid certificate for the HTTPS connection. Also, the URL is currently returning 404 for the CSS file.

Answer 2

So my problem was that url that was hosting the CSS file was not the raw CSS file. So i used this website https://rawgit.com/ to host the CSS file.