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

Abdelrahman fares

@bedofares90 points

Student at Fachhochschule St Pölten

Latest solutions

  • Results summary component using HTML & CSS


    Abdelrahman fares•90
    Submitted almost 2 years ago

    0 comments
  • age-calculator-app solution


    Abdelrahman fares•90
    Submitted almost 2 years ago

    0 comments
  • Newsletter-sign-up-with-success-message-main solution


    Abdelrahman fares•90
    Submitted almost 2 years ago

    0 comments

Latest comments

  • SdevWeb•650
    @Veustyle
    Submitted almost 2 years ago

    HTML/CSS & Javascript

    1
    Abdelrahman fares•90
    @bedofares
    Posted almost 2 years ago

    Good job ! I see that you have the padding-right & left as 0 which I guess if you set it to 10px same as for the top and bottom padding it will look nicer, you can also play around with the padding until you see it looks good.

    I would suggest removing the padding from the .part-left on the mobile screen and increasing the width to 95% it will also look way better aligned.

    like this :

    @media screen and (max-width: 639px)
    .part-left {
        width: 95%;
        padding: 0 0;
    }
    
    Marked as helpful
  • Ahmed Awad•80
    @AhmedAwad97
    Submitted almost 2 years ago

    Responsive summary component using flexbox

    #web-components
    2
    Abdelrahman fares•90
    @bedofares
    Posted almost 2 years ago

    It looks very nice and I like how responsive it is :) . I have only one comment regarding centering it vertically & horizontally. You can achieve this using flexbox .

    what you need to change is :

    body{
       min-height: 100vh;
       display: flex;
       align-items: center;
       justify-content: center;
    }
    

    and remove the margin-top from the order-summary div.

    I hope this helps :)

    Marked as helpful

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