Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
6
Comments
1

Garrett

@gdwade92United States50 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

  • 2nd Attempt HTML/CSS With BEM Naming Convention

    #bem

    Garrett•50
    Submitted 10 months ago

    I would like to know any tips or tricks people use to find the right sizes for the font size, margins, paddings etc. I know the projects dont give this information but I find it a little counter-productive/defeating that the project goal is to get it as close as possible to the images, but the images arent properly to scale so when you complete the project, it doesnt look right at all.

    I would also like to make sure that I was using the correct units when setting margins and paddings.

    lastly, I would like any tips and tricks to condense down the class usage. I know I repeated the same steps several times in the code, I just could not think of a simple and clear name to place on each section.


    0 comments
  • Responsive page with grid, custom variables, and media queries


    Garrett•50
    Submitted about 1 year ago

    I am sure I'm not the only one stuck in the "do I use flex or grid" loop but I genuinely don't know which one is better in any specific situations. Any guidance to resources or feedback would be fantastic.

    I am also apparently not as well versed in the basic tools for HTML (like thinking to use span tags) etc., and would like to hear how you look at planning and tackling your specific projects.


    1 comment
  • Responsive card that uses advanced hovering and and overlaid link


    Garrett•50
    Submitted about 1 year ago

    I always feel like I struggle to get the proper sizing for the cards with each project, so any guidance on how people naturally get the correct size would be beneficial.

    I would also love for anyone to take a look at my code and explain to me how I would be able to refactor it down to a more clear, condensed version of this project.


    1 comment
  • Vanilla HTML/CSS - Grid used for links and transition for hover/focus


    Garrett•50
    Submitted about 1 year ago

    I would love to have a more in-depth explanation of width and height with HTML/CSS. I understand the fundamentals and I have spent extensive time watching youtubers like Kevin Powell, but I dont quite grasp it.

    I would also feel like I am missing a key bit of information that would help me acquire the measurements needed to re-create the initial project.


    2 comments
  • Vanilla HTML/CSS With Media Query, Font Face Usage, and Display Grid


    Garrett•50
    Submitted about 1 year ago

    I dont know what I dont know. I feel good about the project but I realize there is always a better, more semantic way to organize and style each line. I dont think I'm anywhere near where I need to be in either regard and am always open for guidance on how to improve.


    1 comment
  • Fixed Width QR-Component using flex, set width, and variable font-face


    Garrett•50
    Submitted about 1 year ago

    I would really like to know if there was a responsive solution to keep the card the same size, regardless of screen size, as was presumably displayed with the desktop and mobile example images. I spent literal days trying to find a good solution and ultimately settled on a fixed width to achieve the goal.

    I am also sure I missed obvious things like accessibility during development among other things, but I dont even know what I dont know and would love any feedback and criticism to improve and include for the next one.


    1 comment

Latest comments

  • Garrett•50
    @gdwade92
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    I am proud of the table section towards the bottom of the page. I think it came together well, not perfectly, but extremely close to the initial design. I feel like I wasted a lot of time with copy and pasting each section into their respective tags and would like to find short-cuts to better utilize Emmet moving forward.

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

    The major challenges would be hosting variable fonts, properly setting up a table with display:grid, and properly setting up the media query. I overcame them with a combination of reading the MDN documents, trial, and video tutorials in ways to set up each of the 3.

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

    I dont know what I dont know. I feel good about the project but I realize there is always a better, more semantic way to organize and style each line. I dont think I'm anywhere near where I need to be in either regard and am always open for guidance on how to improve.

    Vanilla HTML/CSS With Media Query, Font Face Usage, and Display Grid

    1
    Garrett•50
    @gdwade92
    Posted about 1 year ago

    I realize my variable fonts did not locally transfer with the upload. My disappointment is immeasurable and my day is ruined.

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