Design comparison
Solution retrospective
Here's my solution to this challenge.
I still have a small issue regarding the items that go off, including the footer, when the page is resized.
Any your feedback and advices are more than welcome !
Thank you
Community feedback
- @0xabdulkhaliqPosted over 1 year ago
Hello there π. Congratulations on successfully completing the challenge! π
- I have other recommendations regarding your code that I believe will be of great interest to you.
BACKGROUND iMAGE πΈ:
- Looks like the
background svg
andcolor
has not been set, let me explain How you can easily apply thebackground color
with thesvg
they provided.
- Add the following style rule to your css, and then experience the changes
body { background: url(./images/pattern-background-desktop.svg), #E1E9Ff; background-repeat: no-repeat, no-repeat; }
- Tip, Don't forget to generate a new screenshot after editing the
css
file
.
I hope you find this helpful π Above all, the solution you submitted is great !
Happy coding!
Marked as helpful0@orazdaurenovPosted over 1 year ago@0xAbdulKhalid thank you for your feedback !! I've added the background, actually I forgot about the background.
One more thing if I can ask you, as for the payment button, when the page is resized the button remains unchanged, even if I set it in REM, not pixels
What should I add to match the design ?
thanks
0 - @GenildocsPosted over 1 year ago
Hello, sorry for the delay in responding. You can do it this way, put the content of the footer in a div, for example:
<footer> <div class="">content</div> </footer> This way you can apply the display flex to the footer without affecting the elements contained in it.0 - @GenildocsPosted over 1 year ago
Hello, congratulations on completing the challenge!
- I have a recommendation about the footer section, could you apply flex-box to it and center-align it, then give it a height so it doesn't get stuck to the main content. It also doesn't have enough width to grow and scale the content correctly.
I hope I have helped.
0@orazdaurenovPosted over 1 year ago@Genildocs thank you for your feedback, could you please explain it to me more precisely ? because i tried what you suggested, but don't see any changes
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord