Four Card Feature Section

Community feedback

• 

  P

  Harm Intemann•590

  @ghintemaPosted over 2 years ago

  Hi Shikhar,

  At first I did the color-bars on top of each card as border-top - just like you did. To prevent the these colorbars from curving at the end, I finally modeled them as an extra <div> of only 5px height and with border-radius:5px 5px 0px 0px; This way you get a color-bar without any curving left and right.

  To fix the icon position I propose you this way: Give the cards a position:relative and the icons inside the cards a position: absolute. This way you can easily fix the icons in the bottom right corner of each card using bottom:XXpx and right:XXpx; To "stablize" the entire layout I would also fix the width and height of each cards.

  Hope to have helped you a bit, Cheers, Harm

  Marked as helpful

  1

  ---

  

  Shikhar Srivastava•210

  @shikharsPosted over 2 years ago

  @ghintema Thanks for the great feedback. It helped.

  0