3 Column Preview Card Component

Community feedback

• 

  Gioant•160

  @GioantPosted 12 months ago

  for mobile, i see you already have a border-radius but it is only being applied to one side.

  The issue is that your divs do not have a border. You must add a size to it using the border property. For example:

  border: 1px solid transparent

  after, you can change the border-radius size like you have done.

  based on solution, the top div only requires a border-radius top & the last div to have only a bottom radius.

  you can use the shorthand version (border) or use specific version:

  top:

  • border-top-left-radius
  • border-top-right-radius

  bottom:

  • border-bottom-left-radius
  • border-bottom-right-radius

  for the paragraphs on mobile version, i suggest to just decrease the size and add a line-height.

  hope this helps!

  Marked as helpful

  0
• 

  Ashong•930

  @AshongAbdallah06Posted 12 months ago

  Hi this is my opinion.

  Add separate classes to each card. For example ‘<div class="column sedans”>’ and so on for the rest. And when the screen is in mobile view, use the individual classes and add the ‘border-radius’ where necessary. Since there is no curve on the second element SUVS you make the ‘.sedans {border-radius: none}’

  Marked as helpful

  0