updated four-card

Community feedback

• 

  T

  Grace•31,270

  @grace-snowPosted over 3 years ago

  Hi,

  I have a few suggestions to improve your code, I hope they are helpful

  • the heading here reads as one heading so should be in one heading element, not two. If you wanted to keep it as two headings, the first half would have to be a h1.
  • think about your class names separately to the written content within them. If a content editor changed the heading wording, would classes like "rely" and "power" make sense? Instead something like "page-heading" would make more sense
  • similarly, try to create and use some reusable classes. Instead of defining all the common properties for the boxes over and over again in your css (for things like background color, border-radius, padding etc) just put them on one box class.
  • Then you can add a second class to each box to modify the top border color
  • instead of the current flex approach you have where you are using margins to separate the boxes, try the gap property instead
  • even better, change your markup and do this design with css grid. It is the perfect challenge for grid

  1

  ---

  

  ETINOSA EKHATOR•220

  @Etinosa22Posted over 3 years ago

  Hello Grace-snow! I really appreciate you for taking out time to comment... All you said has been noted and will be worked on Thank you for the honest comment, it means a lot

  0