@jameslegoff92
Posted
Hi there Shane,
Good work on this project. I would just like to point out some things about your project.
-
You should apply the background image and color on the <body> element. If you give a min-height of 100vh to your <body> element you'll have your background image take up the entire viewport. Hence, you won't have any whitespace ruining your design.
-
At the screen width of 607px the design start's to break.
I would challenge you to fix these 2 things. It will definitely help you for when you start designing more complex UIs.
Happy Coding!
Marked as helpful
@ShanePinderDev
Posted
@jameslegoff92
Thanks for your response!
I've put the background image and color on the <body> and that fixed the white space issue! Such a simple fix, yet something I didn't even think of at the time :(
I will look into the design breaking a 607px in a bit and see if I can figure that out.
@jameslegoff92
Posted
@ShanePinderDev If you try to fix it but can't and you need some help, feel free to send me a message :)
Good luck 👍
@ShanePinderDev
Posted
@jameslegoff92 Thanks much! I will reach out to you if I get stuck.
@ShanePinderDev
Posted
@jameslegoff92 I've had a go at trying to fix the problems with the responsiveness of the component. I've added some additional media queries and changed a few things. I've uploaded a new CSS file on which I've left the previous code commented out. Hopefully this will make it a bit easier for you to follow. If you have time to have a look at it and let me have any other suggestions that would be great.
@jameslegoff92
Posted
@ShanePinder I just checked it out. Awesome job my guy 👍 There's only one thing to point out. In your styles.css file on line 286 you have your container class that has a background image. It's creating a overlay with the background image on your body. So just remove it from your container class and it'll be time for you to move onto your next project 👌
I would suggest you try building one of the landing pages offered on this platform. It'll be challenging but you'll definitely learn a lot more that way.
Always feel free to message me if you have any questions or need help.
Happy Coding!
