@zenStroke
Posted
Hi FluffyKas,
Great job on completing the challenge!
I had a look at the live version of your site and overall, I think you did great. There were a few minor issues.
I assume it looks fine on your monitor, but on my 13 inch macbook it seems like there are some scaling/responsiveness issues. The request invite button under 'Next Generation Digital Banking' actually goes below the grey part and enters the next section. Sadly, I am not well-versed in responsive design yet and cannot give you tips on how to improve this.
Similarly, the mockup image overflows to the right. I think this can be fixed if you add overflow: hidden; to the parent element of the image.
Other than that, you managed well! I did the same challenge, and it took around 4 days to complete. If you don't mind, I would appreciate it if you could have a look at my site from your perspective and provide me with some feedback. (note: I haven't optimized for mobile yet)
Also, if you would like, I can send you a screenshot of what I see in my screen of your site in the slack channel if you are in there.
@FluffyKas
Posted
@zenStroke I'm aware the overflow, unfortunately the solution to this is a lot more complicated then an overflow: hidden. :( I'm yet to come up with a better solution. That first hero section is giving me some real trouble :D
Thank you for the feedback though, I appreciate the time you took to look at it! I'll revisit this challenge later when I have a better idea on how to fix this issue. Things like this is the reason I still have a love-hate relationship with CSS :D
I already commented on your solution and gave some feedback on it ^^
@abedfetrat
Posted
@FluffyKas Recently completed this challenge. You can use overflow-x: clip to fix the overflow issue. Basically it's the same as overflow: hidden but this also disables all scrolling on that element. You might need to use it on your whole hero container.
By the way thanks to your solution now I know to use transform: translateY on the hero graphics to offset it instead of using absolute positioning. I had problems that when the graphics scaled up the content below didn't get pushed down accordingly. :thumbsup:
Marked as helpful
@FluffyKas
Posted
@abedfetrat I was trying to make it work with overflow-x: hidden but that just didn't work. Never tried clip though so I'm excited to see if this really works! I give it a go tomorrow, thank you so much!
And I'm happy I was able to help you, too. I started out using absolute positioning but changed it as I was running into problems as well ^^ What a tricky little challenge :D
