Summary card using CSS

Community feedback

• 

  Thomas Hogben•150

  @BananaTechsPosted almost 3 years ago

  Hi Katherin, looks great! It seems that the sizing problems on mobile come from the fixed height of the .page and .card divs. Without them, the card should resize itself to fit all the available content inside without being cut off!

  As for the width, I guess not much can be done without using media queries for responsive design, other than making the fixed width smaller.

  Also, you could try using the :hover pseudoselector to implement the active states!

  .main-payment:hover {
    background-color: //Insert favourite purple here
  }
  

  Lastly, while looking at the css for .main-payment, I noticed that the margin styling could be shortened a little:

  .main-payment {
    margin: 10px 40px 20px;
  }
  

  The left margin would just take the same value as the right margin in this instance.

  Hope this helps any. Good luck!

  0