Latest solutions
Product preview card component
Submitted 5 months agoIn the mobile view, there is a small gap between the image and its container. I’ve tried several methods to resolve it, but adjustments tend to disrupt other alignments. Assistance in removing this gap without impacting the overall layout would be greatly appreciated.
Profile Card Component
Submitted 5 months agoI initially faced challenges with adding the SVG background image to the component. I would appreciate assistance in properly implementing it.
Social Links Profile
Submitted 5 months agoI would appreciate your help in verifying whether the font size and weight are appropriate.
Blog Preview Card
Submitted 6 months agoI am seeking assistance with achieving precise spacing between elements. I am having difficulty extracting accurate information regarding element spacing and would like to verify whether I have achieved the desired spacing correctly. Guidance on this matter would be greatly appreciated.
QR_Code_Component
Submitted 7 months agoIn the Figma file, the text size for "Improve your front-end skills by building projects" is set to 22px. However, when I adjust the size to 22px, the alignment shifts and does not match the design as specified. I have currently kept it at 20px to maintain alignment.
I would appreciate assistance in setting the text size to 22px while ensuring proper alignment consistent with the Figma design.
Latest comments
- @hadar888Submitted 6 months ago@naveenkkannanPosted 5 months ago
Great work! To match the design, you can remove the right-side border radius of the image by applying (border-radius: 10px 10px 0 0;). Additionally, you can achieve a four-line description by slightly increasing the width property.
0 - @stephany247Submitted 5 months agoWhat are you most proud of, and what would you do differently next time?
I am most proud of the responsiveness and accessibility features I implemented in this project. By using semantic HTML5 and ensuring that all interactive elements have hover and focus states, I enhanced the user experience for a wider audience. Additionally, the use of CSS custom properties allowed for a cleaner and more maintainable codebase.
Next time, I would consider exploring additional animations for hover states to make the interaction more engaging. Lastly, I want to experiment with more advanced CSS techniques, such as CSS Grid, to improve layout control.
What challenges did you encounter, and how did you overcome them?I didn't really face any significant challenges.
What specific areas of your project would you like help with?I would love to get feedback on any improvements and best practices I can implement to improve my skills.
@naveenkkannanPosted 5 months agoGreat job on the responsiveness and accessibility, using semantic HTML5 and CSS custom properties for clean code. Keep refining animations, layouts, and code scalability—you're on the right track!
0 - @davidosi93Submitted 7 months agoWhat are you most proud of, and what would you do differently next time?
Second Challenge Blog-Preview-Card finished using HTML and CSS with Flexbox
What challenges did you encounter, and how did you overcome them?Using Flexbox
What specific areas of your project would you like help with?I´m always not sure about padding and margin. Which one to use and when. I always have to try multiple times before deciding which one to use.
@naveenkkannanPosted 6 months agoYou can refer to the values in the Figma file for specific padding and margin requirements. Additionally, studying the CSS Box Model will help you understand when to use margin versus padding for better layout control.
0 - @MatheriaSubmitted 7 months ago