All comments

• 

  Roxanne•260

  @rox-stahlSubmitted about 2 years ago

  Project 1: What did you find difficult while building the project? • I was shocked this was under "newbie" and did a lot of reference checks! MDN is my new best friend :D
  -adding two images that are set to two separate media queries. Questions about window sizes for browser, I wanted to set for smaller? -adding an SVG to a button with text - spacing is not correct.
  How do I get the spacing between the icon and the text?

  Which areas of your code are you unsure of? • Umm, it looks good, but I'm sure there are easier ways to go about it. Maybe some refactoring or using a different method I haven't explored yet...suggestions?

  Do you have any questions about best practices? • Best ways to decide flex or grid?

  

  HTML/CSS - Product preview card component (Responsive)

  1

  40
  

  Abdeljalil wahib•80

  @Ajwahib95Posted about 2 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

  0