I am able to get the value a user enter to my form i'm very proud of that
What challenges did you encounter, and how did you overcome them?Funny i do not remember how to center a div😂, just a little google search.
So how do you make that div to the center?😂
i'm proud that my skills in html and css are getting better i still have a little trouble in responsive web desgin but i will work for it ..
What specific areas of your project would you like help with?everything especially responsive web desgin and thanks ...
Hey mate, you have done a great job on this challenge, almost perfect tho, but there is ain't perfect in this world hehe.
Here's some advice from me based on what i'm see :
div class="Main". You don't have to write like that, you can write <main></main> instead. Read the article that i give you to understand about semantic html and try to implement them from now on.<img /> tag inside a div.letter-spacing: your_value_here instead.line-height : your_value_here to your text2 class, to give those line paragraph spacing with vertical axis (up to bottom).bacground-color: white when i resize my browser to mobile screens.And i think that's it from now. Hope you doing well in your next challenge and have a nice day mate.
Did you have any difficulties in making this challenge?
What I am most proud of in this project is that I finally mastered using both Grid and Flexbox to create a layout. Prior to this, I had never used Grid and Flexbox for layout design. Achieving this is truly an exciting milestone for me.
What challenges did you encounter, and how did you overcome them?One of the challenges I encountered was positioning the modal (newsletter/success) in the center of the layout using Grid. Initially, I struggled to center the modal. However, I discovered that using align-content: center;, justify-content: center;, and justify-items: center; solved the problem and perfectly centered the modal.
What specific areas of your project would you like help with?If possible, please review my CSS. I am a complete beginner when it comes to CSS; previously, I was only taught to use it in a way that worked for desktop layouts without considering responsiveness. Please teach me the best practices in CSS if there are areas that need improvement.
*, *::before, *::after of the form padding: 0 and margin: 0.newslatter-modal class does not stick to the side of the browser when on mobile screen.margin. Add it to your media queries.success-modal class, provide margins for the vertical and horizontal axes at mobile screen. Add it to your media queries as well.But you've done your best, the rest is to stay consistent and keep practicing by doing small challenge projects (don't watch too many tutorials without hands-on experience) first from this website or from other websites or from other sources. Have a nice day mate! 😊
Reflecting on the project, I am particularly pleased with how I implemented responsive design principles to ensure the product preview card component functions seamlessly across diverse devices. This involved using flexible layouts and media queries to adapt the interface from mobile screens to larger desktop displays, enhancing user accessibility and interaction.
What challenges did you encounter, and how did you overcome them?One of the main challenges I faced was mastering the element for loading different-sized images based on media queries, requiring focused learning and experimentation to integrate effectively into the project.
What specific areas of your project would you like help with?I don’t need help with any specific areas of my project at the moment.
flex-wrap: wrap to card__body__price to prevent card__body__price__full from escaping the card__body container if the browser width is reduced.max-width or calc() method in it to get better results (watching tutorials on youtube about it will help you a lot later).But you've done a great job, keep learning and practicing by continuing to work on new projects to improve your frontend developer skills.
