Easy Fullscreen Landing Page With HTML & CSS

31
106

In this small project I will show you how to create a simple HTML/CSS landing page with a fullscreen image in the background. We will also use a little bit of flexbox styling. CODE: Code for…

source

31 COMMENTS

  1. Hey Brad! Great tutorial! It helped me a lot. But I have one question… When i add the css 'display: flex', the background image 'cuts off' on the right side. I have tried to change the width to 100% and 100vw, but both of them don't work. How could I fix it?

  2. This was an awesome tutorial but I run into an issue, I chose to not put 0 padding and margin using the asterisk like you did so between my showcase and section-a there was some white space between them, I couldn't remove it unless I either put 0 margin/padding on everything with * or set a negative value to margin-top on section-a
    I tried putting margin-bottom: 0; on the showcase and margin-top: 0; on the section-a but it always had some space unless I did something like margin-top: -20px; on section-a
    I ended up using the * and set everything's margin/padding to 0 but if anyways has any other way, I'd appreciate it

  3. Currently having nightmares trying to get something similar to display on ipad/iphone, Android works fine. Has anyone tested this on iphone/ipad, thanks in advance. From many searchs it seems to be a known bug with Safari. And thanks Brad.

  4. I just ran through this video for a second time to work on some concepts that just weren't sticking for me. Thank you again for your work. I became a basic patreon and as soon as I working again I will upgrade. Thanks

  5. I just want to say that your tutorials have been a massive help and have single-handedly taken me through my University project to create a website – the web development unit sucks and they're not actually teaching us the HTML & CSS, they expect us to Google it (no seriously, if we ask questions they tell us to just Google it, they're shit).

    I do have one question though: with 4/5K screens becoming more and more common, is it not better to go with the 5K image size? Otherwise wouldn't the standard 1080p cause 'problems' on higher res screens?

LEAVE A REPLY