e-learning Landingpage with flex and

Hi Harm

Good effort but there are quite a couple of issues that need to be addressed. To answer your question as to why your top button is not getting a hover state.. well firstly your large hero image is positioned absolute and its containing parent the "header" is positioned relative but your "topline" container which contains the logo and the button has no display property associated with it neither a z-index. So in order to fix your issue with your current code just add position relative to the topline with a z-index of 1.

Some other feedback is look at how you design your layout. you over complicating things. How i go about it is before i even touch code I do a rough sketch of the container structure and how i could lay them it in the simplest way possible. then once im ready ill lay them out either using flexbox or grid. If you not familiar with those two layout methods I would strongly suggest your look into them as they will help you a lot down the road.

Look at your Validation results and correct them is also a good first step.

Happy Coding

Hi Gavin,

thank you for your feedback. It's highly appreciated. I really thank you for it. And after a while of thinking and trying I even got it WHY the z-index is the key here: The button is otherwise covered by a none visible area of the logo, so it's been visible but not hoverable.