3 column card using CSS Flexbox and Media Queries

Community feedback

• 

  Muhammad Shajjar•1,100

  @muhammadshajjarPosted over 3 years ago

  Great work! but always try to make it better,

  To overcome your accessibility issue you would need to add some semantic markers to designate sections of the page as the header, navigation, main content, and footer e.g:

  <header>
  ////
  </header>
  
  <main>
  ////
  </main>
  

  Thanks,

  Marked as helpful

  1

  ---

  

  Rachana Hegde•155

  @rachanahegdePosted over 3 years ago

  @muhammadshajjar Ohh okay, I wasn't sure how to address the accessibility issues so thank you for the advice. I appreciate it.

  0
• 

  Ahmed Faisal•5,095

  @afrusselPosted over 3 years ago

  Hi, well done. As a first work is awesome.
  You can use a small library for flexbox named flexboxgrid.com. it helps you to make your site responsive with less css code.

  Marked as helpful

  1

  ---

  

  Rachana Hegde•155

  @rachanahegdePosted over 3 years ago

  @afrussel Hi Ahmed, thank you! I will look into it and try to use it for my next project.

  0
• 

  spyder•315

  @ratan17Posted over 3 years ago

  may i know why you didn't go flex properties to center your .cards container ?

  1

  ---

  

  Rachana Hegde•155

  @rachanahegdePosted over 3 years ago

  @ratan17 I attempted this but it caused the container to take up the entire web page. To make it look more like the design, I altered the margins instead.

  0

  

  spyder•315

  @ratan17Posted over 3 years ago

  @rachanahegde alright. you could have set flex properties to body element instead to center your .cards container. anyways nice approach and keep it up!

  1