3 Column preview card component with little animations

Community feedback

• 

  Adriano•38,390

  @AdrianoEscarabotePosted almost 2 years ago

  Hello Arturo Navarro Riveros, how are you? I truly loved your project's outcome, however I have some advice that I hope you'll find useful:

  I noticed that you used a button in which case the best option would be an a, because in my head when a person clicks on a button written Read more, he is not confirming a form, or something like, it will be redirected to another page, to read more about!

  to solve this problem do this:

  <a href="/">Learn More</a>

  To improve the code structure wrap this div:

  <div class="attribution">

  with the semantic tag footer

  The remainder is excellent.

  I hope it's useful. 👍

  Marked as helpful

  0
• 

  Hassia Issah•50,650

  @HassiaiPosted almost 2 years ago

  @chopinex, how are you. Well done for completing this challenge To make your page responsive, don't use height. give the .vehiculo a padding value and remove the height value in the main To center the content on a page in the body declare the following : body{ min-height-100vh; display: flex; align-items: center; justify-content: center;} or body{ min-height: 100vh; display: grid; place-items:center;} . No need to specify margin for the main . you can add margin: 0 auto to the main Use em and rem as unit for your margin and padding. In the media query , give the body a percentage width: body{ width: 80%} or body{width: 90%} and remove align-content:flex-start. Again remove the height value for the main in the media query and dont give it a margin. In the main you declare display: block; eg: main{ width: 300px ; display: block}. Hope am helpful. Happy coding.

  Marked as helpful

  0