Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
2
Comments
3

jacobkho

@jacobkho60 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

  • Responsive css using flexbox


    jacobkho•60
    Submitted 4 months ago

    More comfortability with everything.


    0 comments
  • Mobile and Desktop solution using Flexbox


    jacobkho•60
    Submitted 4 months ago

    I want to become more efficient with my code, though I know this is just a repetition thing.


    1 comment

Latest comments

  • Gabriel Rodriguez Perez•160
    @glrodriperez98
    Submitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    I'm most proud of how clean and close to the original design I was able to get the layout, especially using only HTML and CSS. The final result looks polished, and I paid close attention to spacing, alignment, and typography, which helped meet the challenge of coming as close to the provided design as possible.

    If I were to do it again, I’d probably start by setting up a mobile-first responsive structure so the design adapts to different screen sizes better - when looking at the mobile version it looks a little bit bigger than it does in the provided examples. I’d also consider using a CSS preprocessor or utility framework like Tailwind CSS for faster styling, which is something that I'm currently looking into offline.

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

    One challenge I faced was making sure the layout remained vertically centered while also allowing the attribution text to sit below the card instead of being centered along with it. Initially, the attribution was stuck in the middle of the screen due to flexbox settings on the body. I solved this by switching the layout to a column-based flexbox and adjusting padding and height to allow natural flow.

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

    I’d love some feedback on how to make the layout more responsive, particularly for smaller mobile devices and large desktop screens. Additionally, I’m curious about best practices for accessibility in a design like this. For example, are there ARIA attributes or semantic improvements I should be including to make the preview card more screen-reader friendly?

    Blog Preview Card Challenge

    1
    jacobkho•60
    @jacobkho
    Posted 4 months ago

    I think that your code looks clean and well formatted and easy to read. I think that if we were to get nit picky I would look into semantic html so that your code is even easier to read as they give guidance on how to label your divs.

    I'm also new to coding and starting for mobile first is backwards to me but makes a lot of sense as we mostly use our phones for web viewing.

    Marked as helpful
  • Rafaela Gomes•120
    @zrafaelagomes
    Submitted 4 months ago

    HTML, CSS, Javascript

    #accessibility#jss#cube-css
    1
    jacobkho•60
    @jacobkho
    Posted 4 months ago

    Looks good. Body text uses justify alignment, which can reduce readability for some. Code is clean and readable. Minor differences from the original, but overall consistent.

    Marked as helpful
  • MatheusMorii•30
    @matheus-morii
    Submitted 4 months ago

    QR code component - HTML CSS

    1
    jacobkho•60
    @jacobkho
    Posted 4 months ago

    Really clean job overall. You used semantic HTML correctly, and the structure is solid. The layout holds up well across screen sizes—nice use of flex. Code is readable and organized, no clutter.

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