Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
6
Comments
1
Abdeljalil wahib
@Ajwahib95

All comments

  • Roxanne•260
    @rox-stahl
    Submitted almost 3 years ago

    HTML/CSS - Product preview card component (Responsive)

    1
    Abdeljalil wahib•80
    @Ajwahib95
    Posted almost 3 years ago

    Hey Roxanne, great job on this project!

      In terms of the button layout I added the following:
    
      #cart {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 10px;
       }
       
    

    using flexbox gives you more control over the elements and their positioning. I noticed that the svg icon and the text were not properly aligned, so I used justify-content to align them horizontally and align-items for vertical alignment, as for the spacing between the svg and the text, I used the gap property. I hope you find this helpful!

    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