Four Card Section using HTML+CSS (Flexbox)

Community feedback

• 

  vishal wankhade•495

  @Vishal-wankhadePosted over 3 years ago

  wrap the 4 boxes in a section use flex in it and give flex-direction column, make three columns inside that section, the 1st box in 1st column, the two center boxes in 2nd column,3rd box in the 3rd column in this way you can give it proper structure without using the transform property. see my solution to this challenge for any help https://www.frontendmentor.io/solutions/fourcardfeaturesectionmaster-solution-using-html-and-css-o2VKoPxKH hope this will help

  Marked as helpful

  0

  ---

  

  Azmi Fitra•95

  @azmifitraPosted over 3 years ago

  @Vishal-wankhade Hallo Vishal! I see your point here and your solution is really helpful. I will fix my code soon and try to implement it. Thankyou for the advice! :)

  0
• 

  Hafizan Adli•1,190

  @hafizanadliPosted over 3 years ago

  I think you use too many useless div wrapper. For example, supervisor class don't need to be wrapped with box and box1 div. You can simply use flexbox in boxes container to arrange the cards.

  Marked as helpful

  0

  ---

  

  Azmi Fitra•95

  @azmifitraPosted over 3 years ago

  @hafizanadli Hai hafiz! Thanks for your suggestion, i will fix it later :).

  0
• 

  Ahmed Faisal•5,095

  @afrusselPosted over 3 years ago

  Usring flexbox with positions you can solve this problem. No need to use transform.

  Marked as helpful

  0

  ---

  

  Azmi Fitra•95

  @azmifitraPosted over 3 years ago

  @afrussel Thanks for your advice :). Happy codding!

  0