Hi! This is my first junior-level challenge and It really helped me to practice my skills with CSS Grid. I would appreciate any feedback! :)
Yasmina S
@yvsminvsAll comments
- @yvsminvsSubmitted over 3 years ago@yvsminvsPosted over 3 years ago
Hi @AgataLiberska!
Thank you!! I named one of the classes as ''head'' as a random name but I understand that it can be a little bit confusing... I'm going to modify all these things that you've mentioned!
And once again, thank you so much for the tips!! :)
0 - @obeorchiaSubmitted over 3 years ago
Hello, It's my first challenge on frontend mentor. Thanks for your challenge ! For this challenge, I had some difficulty on the SVG background integration. I used in CSS background-image and background-position to place the two SVG circle, but I'm not satisfy of the responsive behavior for the background. I used media queries for adjust the mobile size because the two circle are not in a good position in the small screen size. I don't think my solution is the best one. If you can help and advise me on the good technique that would be super nice! Thank you in advance for your feedback.
@yvsminvsPosted over 3 years agoHi Olivier!
Congratulations on your first challenge!!
I see that you added the circles as background images which is amazing. I'd suggest you to use vh and vw instead of px when you position these. With vh and vw units the images adjust to the viewport and you can achieve the responsiveness of the background. You can check my solution to see how to implement it.
Hope it helps you!
0 - @CraigCodezSubmitted over 3 years ago
Hello,
I'm struggling with how the page responds to the web page being reduced. I think it may be down to my use of PX vs REM/EM/% but confirmation of this would be appreciated.
This is my fist attempt at building a feature page without a tutorial on Udemy or Youtube. Any feedback on how I should continue/ progress my learning is appreciated also!
Thanks
@yvsminvsPosted over 3 years agoHi Craig!
Congratulations on your first attempt, it looks pretty good!! You can also try to do it for desktop using media queries and, in this case, CSS Grid :)
I checked your code and I'd suggest you to remove the width and the height assigned to these boxes. Instead, use min-width and min-height.
When you assign a determined width/height you are fixing these values. That's why when you reduce the page, the boxes don't ''shrink''.
Hope it helps you!
0