Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
8
Comments
9
Houlaymatou B.
@code-techhb

All comments

  • Mirna Andrišić•540
    @mandrisic
    Submitted 5 months ago

    Testimonials grid section

    1
    Houlaymatou B.•110
    @code-techhb
    Posted 5 months ago

    congratulations on solving the challenge 🎊. One thing I would suggest is to center the entire grid. It makes it look nicer to me :)

    Marked as helpful
  • P
    Matthieu Bonjour•270
    @Matthieu83600
    Submitted 5 months ago

    Four card feature section using CSS Grid

    1
    Houlaymatou B.•110
    @code-techhb
    Posted 5 months ago

    I love how you leveraged CSS pseudo-class selectors. Next time, I'll try to use that in my project too :)

  • Aaron Padilla•10
    @aaronpadilla20
    Submitted 6 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud because this is my first excercise that I do by myself, without any kind of help, this is the start of my adventure.

    What challenges did you encounter, and how did you overcome them?

    I have some difficults centering the card and the middle of the page, I need to check some notes that I have and also I need to use some help from chatGPT.

    What specific areas of your project would you like help with?

    How I can know the colors that are used?

    My first excercise - Using HTML 5 and CSS

    1
    Houlaymatou B.•110
    @code-techhb
    Posted 6 months ago

    Congratulations @aaronpadilla20 on completing your first coding project all by yourself 🥳! You should definitely be proud of yourself.

    To check which color is being applied to your component, you can use the chrome developer tool to inspect your code. Here's a tutorial that can help you https://youtu.be/fxplz32rgEQ?si=Q2JtP_fGrIS_YhCF. If you're using another browser just feel free to look it up on yt.

  • Tiago Pereira•200
    @BuildAndBreak
    Submitted 6 months ago

    Product card component

    1
    Houlaymatou B.•110
    @code-techhb
    Posted 6 months ago

    Great Job Tiago. I love how you used the picture tag for the image. One thing you could've added is a hover to the add to cart button.

  • budijiie•100
    @budijiie
    Submitted 7 months ago

    Recipe page

    1
    Houlaymatou B.•110
    @code-techhb
    Posted 7 months ago

    Nice Work on this challenge 🎊! I love how you structured your HTMl and used semantic html all the way through.

    Some suggestions to perfect this website would be to add some margin between the footer and the recipe container so everything is clean and easy to spot. I also struggled with adding some space between the li markers and the text just like in the design provided. So, if you can add those, it'll be fabulous 👌🏾

  • Juan Andrés Sánchez López (jaslopez)•510
    @erinur
    Submitted 7 months ago

    Social links profile

    1
    Houlaymatou B.•110
    @code-techhb
    Posted 7 months ago

    Congratulations on completing the social profile links 🎊

    Here are some suggestions I have for you: In writing HTML, I would recommend you use more semantic HTML like main, section, article, etc instead of just div as it will improve accessibility.

    In CSS, I recommend you do not use fix width. Instead you can use max-width/min-width to prioritize responsiveness. It's in this direction that I would get rid of the fix width and height in the root class and only have the body background. You could also add some border-radius to the card (container class) to resemble the design more.

  • Estaire•30
    @Estaire
    Submitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud of learning how to properly use github in my projects. Next time, I would probably use more appropriate tags in markup.

    What challenges did you encounter, and how did you overcome them?

    My only challenge was trying to figure out what the font size of the heading was in order to have it match the one in the design. I overcame it by initially setting it to 16 pixels, and incrementing it by 1 until it matched.

    What specific areas of your project would you like help with?

    I want to know what parts, if any, are unnecessary and what I could possibly do to simplify the code.

    Flexbox

    1
    Houlaymatou B.•110
    @code-techhb
    Posted 7 months ago

    Congrats on completing your first challenge, Estaire 🎊!

    I love how you kept the code simple and to the point.

    One thing I would suggest experimenting with, even for simple projects, is using responsive design units like rem and CSS variables. This can help make your code more flexible and maintainable in the long run.

  • Aaron Hoyos•70
    @chochimus
    Submitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    I included some light animation and transitioning to make the component responsive.

    What challenges did you encounter, and how did you overcome them?

    When styling the svg image I noticed that the mobile version was slightly zoomed in. In order to get this as close as I could to the previews took a little bit of research and trial and error.

    What specific areas of your project would you like help with?

    Mostly, deciding on exact and consistent padding between certain components. Similarly, when to rely on flex for positioning and when to just stick with classic box display.

    Blog preview card

    1
    Houlaymatou B.•110
    @code-techhb
    Posted 7 months ago

    Wow! You've done an amazing job with this challenge. I love how you added animation to the card when you visit the webpage for the first time ✨ and the hover effect on the card as well—it's really well thought out.

    I reviewed your code, and first of all, I wanna say thank you for highlighting the importance of the font folder, and showing how to use it. I didn't really know what it is for when I can use the import line of code ^^ Now it makes sense 😄.

    Your HTML is straightforward, and the CSS is clean with easy to understand class names.

    Great job on this, Aaron!

  • JorgePlanchuelo•30
    @JorgePlanchuelo
    Submitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    It's just an aproximation

    QR card aproximation

    3
    Houlaymatou B.•110
    @code-techhb
    Posted 7 months ago

    I can't find the code but Congrats on completing this challenge 🥳!

Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub