product preview card component

Community feedback

• 

  Fancy•320

  @maciejkrol18Posted over 2 years ago

  Yes, you can easily fix it with flexbox. On the other hand, why is the cart icon outside of the button? Remove the transform: translate(46px, 36px); from the cart icon and get it inside of the button. Then apply following styles to the button

  display: flex;
  align-items: center;
  justify-content: center;
  

  This way everything will be centered, but the icon will be sticked to the 'Add to cart' text. You can fix it by either applying a small margin-right to the image or applying a small gap to the button itself (for example gap: 10px; - in case you haven't heard of gap, it's a flexbox property defining a gap between every item in a flex container)

  Marked as helpful

  0

  ---

  

  Salvinas•30

  @SalvinastPosted over 2 years ago

  @FancyBaguette Thanks, updated!

  0
• 

  enochlee•600

  @iamenochleePosted over 2 years ago

  nice!, try adding a position of relative to span.notDiscounted, then use bottom of 5px to align it to the center

  0