@LeandroAzevedo-1Submitted 4 months ago
Latest solutions
Latest comments
- P@shakthivel-rnPosted 4 months ago
Nice work! I like the concept of dividing main css and responsive css into different files. I just noticed one difference, the font seems to different. Great job!
0 - P@giropa832Submitted 4 months agoWhat are you most proud of, and what would you do differently next time?
I am happy to get accustomed to CSS Grid. This project was tricker since it was not only positioning elements on the grid, but also making sure that some were not bigger or smaller than the others.
Again, using a mobile-first approach really simplified my workflow
What challenges did you encounter, and how did you overcome them?Figuring out how to make sure all cards occupy the right space. With css grid is a matter of placing them correctly with
What specific areas of your project would you like help with?align-itemsThere were minor issues with the Figma file. The first card seemed to have different gaps between elements. Is that so?
- @mo7amed5hairySubmitted 4 months ago
- P@FacundoDLRSubmitted 5 months agoWhat are you most proud of, and what would you do differently next time?
🛸Hello FEM Community! I'm Facundo and this is my solution for this challenge! 😊
🛠️ Built with:
- HTML 🧱
- Advanced CSS (Pseudo classes/elements & combinators)🎨
- Variable Fonts 🔠
- Flexbox ⚒️
- Grid ⚒️
- Responsive Design
- SEO 🌍
- Mobile First 📱
- NEW media query ranges syntax
- Conventional commits (git) 📜
Again, thanks to the Front-End Mentor team that creates challenges that make us learn a lot from doing them. 💟
If you have any suggestions on how I can improve this project, feel free to leave me a comment!
Feedback welcome 😊
What challenges did you encounter, and how did you overcome them?In this challenge I had a major problem when changing the preview image of the product depending on the screen size. After looking for solutions for a long time trying to use different image tags and neglecting different attributes, I decided to use two tags and using CSS I was able to solve the problem using the display property.
P@shakthivel-rnPosted 5 months agoNice work! You have perfectly used CSS variables and Relative Units to design the styling. But I noticed that the card did not change to mobile layout when I resized the window.
0 - @collins-aiSubmitted 6 months agoWhat are you most proud of, and what would you do differently next time?
I'm happy i could make the web page mobile responsive, i tested it on my mobile phone and it was looking great.
What challenges did you encounter, and how did you overcome them?It was very difficult to style the project correctly beacuse i couldn't access the figma file to get the design details.
What specific areas of your project would you like help with?Responsive web design.
P@shakthivel-rnPosted 6 months agoGreat job!! Just some minor improvements. The fonts and some spacings does not match with the design. The website seems to be responsive for Desktop and Tablet layout. But for Mobile layout the stylings does not match with the design. You have effectively used media queries, maybe making the width of the card container to be 100% will fill the card when media (max-width: 768px)
0 - @AliMohamed35Submitted 6 months agoP@shakthivel-rnPosted 6 months ago
The Social Links Profile looks really good! I just found some minor mismatches with the mock. Like the size of buttons, size of images, font sizes and text color. Overall, great job!
0
