Four Card Feature Section

Community feedback

• 

  Gerben Dol•3,115

  @GerbenDolPosted over 4 years ago

  Hey! A good way to make your code shorter is to bundle some of the styles for the 4 different cards.

  There are a lot of properties that have the same value, just to list some:

  • height:25%;
  • width:30%;
  • position: absolute;
  • background-color: #FFFFFF;
  • box-shadow: 1px 8px 10px lightgrey;
  • border-style:none;
  • border-top-style: solid;
  • border-width: 3px;
  • transition: .2s;

  If you would combine these all under one class it would help your code massively!

  You can either do that by putting all this code under de following selector: . supervisor, . teambuilder, .calculator, .karma { /* Shared styles go here */ } and after that applying the more specific styles like position and border color for each specific class.

  Or you can add an extra class, for example .card, to all the items and put the common styles in there.

  Hope this helps!

  2

  ---

  

  Siddhant jha•215

  @siddhantJHPosted over 4 years ago

  @GerbenDol thank's a lot.

  0

  

  Gerben Dol•3,115

  @GerbenDolPosted over 4 years ago

  @siddhantJH You're welcome!

  0