P
@loiccape
Latest solutions
Newsletter Sign-Up Form + Success Message Built with HTML, CSS and JS
Submitted 7 months agoI'd like help on how I could better set the dimension of the mobile screen size (375px - 425px).
Also any advice on the best rule of thumb to follow when setting vertical spacing. I find percentages with width dimension simple as it's usually just a percentage of the screen width or parent width, but height dimensions are a bit more tricky for me.
Testimonial Grid Section built with HTML and CSS
Submitted 8 months agoSizing in CSS to achieve more accurate dimensions.
Four Card Feature Section built with Semantic HTML and CSS
Submitted 8 months agoI am open to any advice on this.
Latest comments
- @DAJ350
Hey, well done on completing this challenge. Looks like you've grasped a number of important concepts well.
I noticed you haven't implemented a method of carrying over the inputted email value to the success page and displaying it in the text. This was quite a tricky one.
In my attempt to overcome this, I learnt about
localStorageandsessionStorage. You may want to take a look into these objects and learn of how to use them to store and retrieve data in your code.All the best, Happy coding!
Marked as helpful - @Ejiro-FrancesWhat are you most proud of, and what would you do differently next time?
I have added to my coding vocabulary and I have learnt a lot from this project.
What challenges did you encounter, and how did you overcome them?Writing the javascript was a challenge, I checked google for ways to understand function declarations.
The media query sizing was challenging as a bigger laptop screen meant disaster for the wardrobe image. I set a max width to combat this.
What specific areas of your project would you like help with?I would like feedback on my code.
@DAJ350Well done completing this project!
JavaScript is one of the more difficult languages to learn in comparison to HTML and CSS. To help you get more familiarised with it you can complete the free course provide by Codecademy.
I see you have used Sass which is great! Becoming fluent with a preprocessor can help you reduce your time spent on styling.
Marked as helpful - P@Igorsimic1988@DAJ350
Hey, great job completing this challenge!
If you decide to revisit this challenge for improvement, I recommend attempting to add the active states!
You can add active states by using pseudo classes such as :hover. Check out :hover MDN documentation.
Happy Coding!😃
- @Alingggg@DAJ350
Hey, great job taking this coding challenge on. You done well getting your project to look as close as it does to the design.
If you decide to reattempt this challenge, I urge you to attempt implementing the background pattern in the purple card. You may want to take a look into properties such as the z-index, position and offset properties for it.
Nonetheless, great job and happy coding!
- P@Igorsimic1988@DAJ350
Hey, great work attempting this project!
I was impressed by your approach to recreating the card container layout. Just goes to show just how useful Flex-box can be.
If you were to look into improving this code, I'd suggest revisiting the dimensions of the card as well as the passive white space around the text in the header. You want to try and get it to match as closely as you can to the design. To give yourself a challenge, perhaps reattempt creating the card container layout with CSS Grids.
Well done, once again. Happy Coding!
- @rehmali@DAJ350
Hey, great job attempting this challenge! You have shown a great understanding of the fundamentals of structuring content with HTML and adding styling with CSS.
I noticed that when viewing the project on a desktop, the dimensions of the preview card seemed better suited for mobile screen sizes. Perhaps taking another look into the styles you have added to your media queries and the media features you have set could help you better optimise the responsive design of your project.
If you would like to brush up on media queries, here is a great resource for it.
Happy Coding!
