Four Card Feature Section using HTML & CSS

Community feedback

• 

  Lawrence•240

  @LawrencePryerPosted almost 4 years ago

  Hi Mark

  Great work and looks very close to me! As you mentioned, the position of the icons is maybe the one obvious difference.

  I just had a go at this challenge myself and managed to position the icons by using absolute positioning. There may be better ways but this seemed to work for me.

  For your .box class try setting the position: relative and then give your icons a class and set these to position: absolute. You can then try something like bottom: 30px and right: 30px to get them exactly where you want them.

  I hope that helps. Keep up the good work!

  Lawrence

  1

  ---

  

  Mark Sainsbury•45

  @Sa1nersPosted almost 4 years ago

  @LawrencePryer Thanks for the feedback. i have had issues using absolute positioning before so was wary of using it. However its a good point so will try a version using it and let you know how it goes!

  0

  

  Mark Sainsbury•45

  @Sa1nersPosted almost 4 years ago

  @LawrencePryer I tried it and it worked fine. I didn't need to create new classes, i just used the img{} as all the images are within the same parent .box{} thanks again for the suggestion.

  0
• 

  Chris•740

  @chrisbailey85Posted almost 4 years ago

  Well done. I haven't actually done this challenge myself yet but I have been planning out how I would do it as it's one I plan to do soon. For the positioning of the cards I recommend looking into css grid, when I first saw this project I felt like it would be a perfect project for practicing css grid, I think you could also do with reducing the box shadow on the cards.

  1

  ---

  

  Mark Sainsbury•45

  @Sa1nersPosted almost 4 years ago

  @chrisbailey85 Many thanks for taking the time to comment. I have not tried css grid before but will give it a go for sure.

  1