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

Shane Pinder

@ShanePinderDev240 points

Newbie developer interested in improving my skills.

I’m currently learning...

HTML, Javascript, CSS, React

Latest solutions

  • Blog Preview Card


    P
    Shane Pinder•240
    Submitted 5 months ago

    Any suggestions for more semantic html tags and minimizing the amount of CSS would be great.


    1 comment
  • QR Code Component


    P
    Shane Pinder•240
    Submitted 5 months ago

    I've submitted a solution for this before but it has been more than a year ago. I'm just restarting on Frontend Mentor using the learning paths.


    1 comment
  • Responsive component signup form using CSS flexbox and JavaScript


    P
    Shane Pinder•240
    Submitted over 2 years ago

    1 comment
  • Responsive landing page using CSS grid and Flexbox and JavaScript


    P
    Shane Pinder•240
    Submitted almost 3 years ago

    1 comment
  • Responsive coming soon page using Grid and Flexbox


    P
    Shane Pinder•240
    Submitted almost 3 years ago

    0 comments
  • Four card section using grid and flexbox


    P
    Shane Pinder•240
    Submitted almost 3 years ago

    0 comments
View more solutions

Latest comments

  • dbzprime•70
    @dbzprime
    Submitted 5 months ago

    Blog Card

    2
    P
    Shane Pinder•240
    @ShanePinderDev
    Posted 5 months ago

    Great job!

    I would just consider using a bit of margin-bottom between the main image and the div with the class of "content" as well as between the h2 and paragraph tags. Also, I would use a heavier font-weight for the h4 tag.

    Marked as helpful
  • P
    Alexis Chardonnal•30
    @Alex-CDNL
    Submitted 5 months ago
    What are you most proud of, and what would you do differently next time?

    Proud to have done this first project, to have found solution alone when i was stuck, to have learn a little bit git. And other stuff like netlify. Next time I'll be more careful about the style, i saw the file at the end, so I was wrong with the colors, the font size etc. Next time I will take my time to analyze the design to have a better HTML structure and CSS more organize.

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

    After putting the container horizontaly in the middle of the body, I didn't succeed to center it vertically. I used position absolute but it wasn't responsive anymore. I found in stack overflow and by playing with right click -> inspect how to center it vertically without using position absolute and having responsive design.

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

    For a project like this with just main container in the middle of the screen, can we use flexbox on the body ? I saw debate in stack overflow to touch the body or not.

    Do I needed to use a h1 ?

    Was it possible to do the CSS with way less line ? Except for example using "padding : 0 0 0 10px" ?

    QR code component

    2
    P
    Shane Pinder•240
    @ShanePinderDev
    Posted 5 months ago

    Hi,

    Great job! Your HTML and CSS are well-structured and readable. The solution looks like the provided design.

    I used flexbox on the body in my solution to help with centering the component. Whether or not it should be used, I'm not sure. Hopefully, someone more experienced than me will answer that for you.

    I also used a h1. Whether or not you choose to use an h1 depends, I think, on how you view the component. If you look at it as a stand alone component, then a h1 seems fine to me. If you view it as a component that will be inserted as a part of a larger page, then it would be better to use an h2 or h3 as that larger page will no doubt already have an h1 and you don't want 2 h1s on the same page.

    I used about the same amount of CSS in my solution as you used in yours. I wouldn't worry about it at this stage. As we progress we will probably learn ways to use less but I think it's fine at this stage.

    Marked as helpful
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

Beta Member

This badge is a shoutout to the early members of our community. They've been around since the early days, putting up with (and reporting!) bugs and adjusting to big UX overhauls!

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