desktop and mobile responsive omelette recipe

Community feedback

• 

  David Smith•390

  @VimDiesel123Posted 9 months ago

  Hi Jackie, I like your solution!

  For centering the component within a container I think that the way you did it with the .center class is a good approach:

  .center{
      display:flex;
      align-items: center;
      justify-content: center;
  }
  

  And for centering things vertically in the viewport I think just adding padding is a good way to do it!

  As long as the container's height is larger than the height of the component, align-items: center will center it vertically.

  margin would also work, but in this case padding is better in my opinion.

  One suggestion I would have would be to use classes instead of ids as selectors when styling different sections. In a smaller project like this it's fine, but styling with ids should be a last resort because they have a high specificity and it could make figuring out why a certain style is or isn't getting applied more complicated and confusing if you have a big mix of .class styles and #id styles.

  Hope that was helpful!

  Marked as helpful

  0

  ---

  

  Jackie Yu•120

  @Jackie247Posted 9 months ago

  @VimDiesel123 Thanks David for the feedback, especially the suggestion. That makes a lot of sense, I appreciate it.

  1