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

HoaCTa

@HoaCTa110 points

I'm a Computer Science major. This is my 3rd year in UC. I'm learning python and web-dev Website: https://hoacta.github.io/personal-project/

Latest solutions

  • Product-preview


    HoaCTa•110
    Submitted 10 months ago

    Calc(). After mobile screen css has defined, How to make use @media (min-width: 1024px) {}. Do we need to re-write most of parts? or is there better way to do it? Before we write css, do we need to reset the html tag every time? I usually have a main tag and a container div to wrap around all of the content. Is that a good practice or not ? Thanks


    2 comments
  • recipe-page12


    HoaCTa•110
    Submitted 12 months ago

    I need help understanding the steps to create a responsive page. If the instructions state 'Mobile: 375px. Desktop: 1440px' and provide two UI screenshots, does this mean any screen size below 375px will appear as the given mobile design, and any screen size above 375px will appear as the desktop design?


    3 comments
  • social-link-profile


    HoaCTa•110
    Submitted 12 months ago

    .


    2 comments
  • Blog-preview card with responsive


    HoaCTa•110
    Submitted 12 months ago

    Padding and margin are still tricky to me. I wonder if I need to calculate the padding/ margin to make the element distributed evenly on the screen . ??


    1 comment
  • QR-code-component


    HoaCTa•110
    Submitted 12 months ago

    2 comments

Latest comments

  • gio•120
    @fakegio
    Submitted 10 months ago
    What are you most proud of, and what would you do differently next time?

    I am most proud of getting the finished product to be almost 100% pixel perfect. What I would do different next time is to pay closer attention to the default text styles (line height, font-weight, font-family), because that would've saved me a lot of time.

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

    The figma file did not contain any spacing information, so I had to ensure I made the right spacing decisions by using the pixel perfect chrome extension, as well as just calculating the remaining space using element heights.

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

    Semantics and class reusability

    Responsive product preview card

    2
    HoaCTa•110
    @HoaCTa
    Posted 10 months ago

    Awesome, look perfect!!

  • Victor•40
    @vic-cod
    Submitted 12 months ago
    What are you most proud of, and what would you do differently next time?

    I was able to make it responsive without many breakpoints.

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

    Used media queries to adjust the layout, and image based on the screen size.

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

    All feedback is welcome. I’m still a beginner.

    Recipe page

    1
    HoaCTa•110
    @HoaCTa
    Posted 12 months ago

    The background color is not match but your solution is very closed with the design. Congrats on finishing the project!!!!

  • Victor•40
    @vic-cod
    Submitted 12 months ago
    What are you most proud of, and what would you do differently next time?

    I was able to complete it without much challenges

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

    Didn't encounter much challenges

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

    All feedbacks are welcome

    Social links profile coding challenge

    1
    HoaCTa•110
    @HoaCTa
    Posted 12 months ago

    Nice page! The box could be slightly larger to match the design. It's a bit tricky to get the exact size right just by eye. Great job finishing the project!

    Marked as helpful
  • andrean-sihombing•350
    @imandreans
    Submitted 12 months ago
    What are you most proud of, and what would you do differently next time?

    I would write my code to be more readable and organize, especially for CSS.

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

    I don't know which heading to use for the text.

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

    I would like to be help with readable code and more on semantic html.

    Blog Preview Card using Flexbox

    1
    HoaCTa•110
    @HoaCTa
    Posted 12 months ago

    Your design looks very close to the solution. If you didn't look at the figma design, it is impressive to build it only by estimating. As far as I know, it is suggested that we don't skip the heading level. For example, use h1 then h2, not h1 then h4. To write more readable code and more semantic code, you should read more on this site https://developer.mozilla.org/en-US/docs/Learn/Accessibility/HTML . It shows us what tag we should use that help our code more accessible. Have fun learning. Congrats on finishing the second project!!!

    Marked as helpful
  • Jack99-DEV•10
    @Jack99-DEV
    Submitted 12 months ago
    What are you most proud of, and what would you do differently next time?

    I was able to get this project completed in a relatively short amount of time, I felt confident in all of the HTML syntax and most of the CSS. Something I would do different is to make sure that I assign IDs and classes to all of my elements ahead of time to help with organisation.

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

    My biggest challenge was getting all the elements centred and aligned properly. I had use google to find documentation and forums to get a solution.

    QR Code Component

    1
    HoaCTa•110
    @HoaCTa
    Posted 12 months ago

    It is great that you felt confident in the syntax, and using Google to read/search for documentation is totally fine if you get stuck. You are good at using alignment and padding properties. The background is not in full screen, maybe you can adjust it using width and height. Kudos on finishing the first assignment.

    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

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