Page loading before CSS is applied

Hi free code campers,
I have a problem with the way the web pages load on this site:

https://fishbite.github.io/draw/index.html

It seems to load the html first and then takes a second or so before the styles are applied. It looks really ugly blah! and I wonder if anyone can shed any light on what might be causing this and how to fix it so the pages load nicely and styled as intended?

Thank you so much if you can help on this.

No FOUC (Flash Of Unstyled Content) for me. Nothing blocking the CSS in the head. Maybe your connection speed? Or noisy connection? Tried it on mobile for a potentially slower experience, but no luck. Had to use force touch to open menu. Not used to that. More intuitive would be a larger area to tap or drag or give me an icon to open it with on mobile.

Solved!

Thank you for the contribution and taking the time to have a look at my problem @tlc35us. It is much appreciated. The problem causing the occurrence of FOUC was a malformed doctype. I had inadvertently written <DOCTYPE! html> instead of <!DOCTYPE html> in the main page and then of course used the copy pasta method to create the additional pages (to save coding time) which led to all the pages having the same error! As to why you couldn’t replicate the problem is a bit of a mystery, perhaps the browser you were using? I’m not sure.

As for the menu, I agree, it does need more available to tap on. The first objective of the menu style was to avoid using the hamburger icon, or something similar, which I particularly dislike! In terms of accessibility, another goal was to make the menu usable without a mouse or touch-screen. This can be achieved by hitting the tab key several times. It’s not pretty, but in want of another method it works for the time being. I’ll look further into making more of the menu visible for the touch screen though. Your observation is welcome. Thank you again for your time.
LoonyToon

UX: writing “non-negative” is asking people to put a negative number in there, minds usually ignore negations. Why don’t you write “positive”?

Thank you for the time you have taken to look at my site @ilenia. I take your observation and suggestion wholeheartedly on board. I will indeed make that amendment :slight_smile: There is still quite a bit to do on the site. It is just bare bones at the moment and was really a practice run on hosting a complete site on GitHub. More to come soon.

Thank you again.
LoonyToon