Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
4
Comments
7
P
Ibrahim Ayed
@IbrahimAyed1

All comments

  • lquispele•60
    @lquispele
    Submitted 5 months ago
    What are you most proud of, and what would you do differently next time?

    I've practiced a lot with this challenge, i just knew a little of general theory but with this i can improve my knowledge

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

    I think, if you wanna have the same such as the image, probably you could take more time just for moving something, but if you do, you would learning more things related with HTML or CSS.

    My first project using HTML and CSS

    1
    P
    Ibrahim Ayed•120
    @IbrahimAyed1
    Posted 5 months ago

    Well done I just finished the same project and it had the same problem ( height of the card ) but the result was so good.

  • Anh•400
    @anhvu1012
    Submitted 5 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud that I managed to center a div without having to google it XD

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

    I did have a problem when trying to resize an img in a div. It didn't resize itself with the div element so later on I realize that I have to set the width of the img myself :)

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

    Is there anywhere in my code that is not "clean" or not well designed? What could I improve in CSS?

    QR code component with HTML and CSS

    2
    P
    Ibrahim Ayed•120
    @IbrahimAyed1
    Posted 5 months ago

    Well done, overall the project is well-implemented, and talking about the areas you need help with, the code would be much cleaner for the developer & the browser when you use semantic elements (main in the container for example) instead of over-usage of divs and also you can add comments. And in the CSS you can add comments.

    Marked as helpful
  • besher aboshaer•120
    @besher94
    Submitted 5 months ago
    What specific areas of your project would you like help with?

    the border radius doesn't show after i put the padding.

    Qr code challenge

    2
    P
    Ibrahim Ayed•120
    @IbrahimAyed1
    Posted 5 months ago

    Good job Beshr, You may need to work more on the project to match the Figma file design. Also, you might need to wrap the elements inside a tag ( usually <main> tag ) instead of working directly inside the body tag, try to use semantic tags instead of using <div> tag, writing readable CSS file will save time so I would recommend that you use the prettier extension on vs code so it can help you make a more readable CSS file. Well done.

    Marked as helpful
  • Taylynne•30
    @taylynne
    Submitted 5 months ago
    What challenges did you encounter, and how did you overcome them?

    My biggest challenge was figuring out a good way to set the width of the main element and keep it centered. I'm not sure if I handled it the best way (I'm really new to starting from scratch with CSS vs editing existing)

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

    Improve handling of the font. I'm not sure if I handled it in css the way that it should be.

    QR Code Design

    1
    P
    Ibrahim Ayed•120
    @IbrahimAyed1
    Posted 5 months ago

    Congrats on the first project. you did well actually but you may need to consider using of box size property in CSS, it will help you to have more control over the size of elements, and if you haven't used it before you can read/watch a video about it and it will help. And you have styling for .card and main ( but they're the same element ) one of them has a property like wa idth with value of 90 and the other is 100 so one will overwrite the other so you may also need to consider this note. Overall you did well and by time you will learn more and more

    Marked as helpful
  • P
    DeerlyDev•100
    @DeerlyDev
    Submitted 5 months ago

    Profile Card with Social Links"

    1
    P
    Ibrahim Ayed•120
    @IbrahimAyed1
    Posted 5 months ago

    The code is well-written and you have used the semantic HTML well it's readable and well-structured, reusable, and also the layout looks good, the design needs a small adjustment to match the design, it's not a big difference but a small one. Well done and I wish you the best in the upcoming challenges.

  • Daniel Oliveira•120
    @spalqui
    Submitted 5 months ago
    What are you most proud of, and what would you do differently next time?

    I was proud that I was able to use CSS Flexbox but want to start using CSS Grid for layout on my next challenges.

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

    None that I can remember.

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

    Suggestions on how would you have used CSS Grid for the layout.

    Blog Preview Card

    1
    P
    Ibrahim Ayed•120
    @IbrahimAyed1
    Posted 5 months ago
    1. good use of Semantic HTML & Accessibility and also using the alt tags.
    2. The improvements i suggest is just the div can be replaced with other tags.
    3. The code is structured well and readable and easy to debug and i didn't need time to find out where to check and specially the class names
    4. The design is almost pixel perfect and that's great
    Marked as helpful
  • ZeroON4•10
    @ZeroON4
    Submitted 5 months ago

    Pagina responsive de QR

    1
    P
    Ibrahim Ayed•120
    @IbrahimAyed1
    Posted 5 months ago
    1. Change div with other semantic html tags
    2. The code in the style tag isn't used so you better remove it for less file size which can affect the performance.
    3. change the colors to stick more with the figma file
    4. The typography is different ( colors , font size and boldness)
    5. add border radius to the image
    6. The template isn't the same as the template when it comes to responsive design

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