@mkm0702
MGDev25
@TheWizCoderAll comments
- @TheWizCoder
Congratulations, you did a good job, but I suggest you mix-blend-mode: multiply; in their front-end to make the image look more flattering. Here are some tips: How to Use mix-blend-mode: multiply; Purpose:
Perfect for color overlays (e.g., tinting images) without complex pseudo-elements.
Darkens underlying colors while preserving highlights—ideal for subtle effects.
Implementation:
css .overlay { background-color: hsl(277, 100%, 50%); /* Your tint color / mix-blend-mode: multiply; position: absolute; / Parent must be
position: relative*/ width: 100%; height: 100%; } Pro Tip:Pair with opacity: 0.5; to soften the effect.
Test contrast—some colors may become too dark.
- @alisafder9What are you most proud of, and what would you do differently next time?
N/A
What challenges did you encounter, and how did you overcome them?N/A
What specific areas of your project would you like help with?A positive feedback is appreciared...!
@TheWizCoderCongratulations, you did a good job, but I suggest you mix-blend-mode: multiply; in their front-end to make the image look more flattering. Here are some tips: How to Use mix-blend-mode: multiply; Purpose:
Perfect for color overlays (e.g., tinting images) without complex pseudo-elements.
Darkens underlying colors while preserving highlights—ideal for subtle effects.
Implementation:
css .overlay { background-color: hsl(277, 100%, 50%); /* Your tint color / mix-blend-mode: multiply; position: absolute; / Parent must be
position: relative*/ width: 100%; height: 100%; } Pro Tip:Pair with opacity: 0.5; to soften the effect.
Test contrast—some colors may become too dark.
Marked as helpful - @duongns-vnWhat are you most proud of, and what would you do differently next time?
I'm confused between two properties:
- grid-template-columns and grid-template-areas Both can help complete this exercise. However, grid template columns have brought optimization in terms of time and neatness.
@TheWizCodergood job the layout looks very good the solution is not significantly different from the design
- @JacobKnittleWhat are you most proud of, and what would you do differently next time?
Getting the cards to layout correctly on the desktop version using grid. and centering content using grid
What challenges did you encounter, and how did you overcome them?centering content using grid and getting the cards to get to the layout.
What specific areas of your project would you like help with?I would like to know if using a div solely for centering content is the best method and any general advice about grid that you can see that I can improve on.
@TheWizCoderwell done doing this design. notes:
consider use semantic tags like <header> and <section> the size and background colorof the cards are different from the design
- @Raxel01What are you most proud of, and what would you do differently next time?
I start being comfortable With CSS Html I will upgrade my skills bu adding java-script
What challenges did you encounter, and how did you overcome them?I think all is Clear for now the structure Of any project start being clear , Design Layouts using HTML Css adust the gap pat attention to details aligning justifying ...
What specific areas of your project would you like help with?I would Like to add some animation to My Projects
@TheWizCoderWell done for completing thischallenge. I noteced that you did not work on the responsive part of the phone screen you can work on it using this code so the design responds to the screen phone @media screen and (max-width: 375px) { }
Marked as helpful - @Randomgituser69What are you most proud of, and what would you do differently next time?
Don't ask. Tired
What challenges did you encounter, and how did you overcome them?hh
What specific areas of your project would you like help with?H
@TheWizCoderthe design looks good. you did a good job
- @neildeoWhat are you most proud of, and what would you do differently next time?
This was a nice quick challenge for me which helped me understand how to use flexbox to create nicely spaced layouts.
What challenges did you encounter, and how did you overcome them?I am unsure whether just setting the width of the card (the in my code) in rem is the best way to get the size I want...
What specific areas of your project would you like help with?@TheWizCoder1.No, I use div 2.Divide the HTML code on the header, section, footer 3.yes 4.can be better 5.no
- @fcorrea35What are you most proud of, and what would you do differently next time?
I managed to be more eficiente and work quicker this time.
What challenges did you encounter, and how did you overcome them?Didn't face any specific difficulties.
What specific areas of your project would you like help with?N/A
@TheWizCoder1- No, I use div 2- Divide the HTML code on the header, section, footer 3- yes 4- can be better 5- no
- @Ganesh-Vajrala@TheWizCoder
Some differences can be clearly noticed, such as the color of the screen background, the size of the design being disproportionate, and the edges not being well rounded. These mistakes can be avoided by reviewing the guide style. You will find the background color used and you will also find instructions regarding the size
Marked as helpful
