VS code editor, CSS style in the head, in-line CSS and W3schools ref

Community feedback

• 

  Tony Ruiz•55

  @tonyruizoPosted over 2 years ago

  Hello Steven!

  Check out those accessibility issues in the report, easy fix for that is to wrap your html div contents inside a landmark, as in <header></header, <main></main>,<section></section> and <footer></footer>.

  Also don't forget the mobile design. Look into some CSS Grid and media queries and you should be able to make it happen.

  1
• 

  Rebekah•770

  @rebekahshaw92Posted over 2 years ago

  Hi Nice first attempt.

  A quick tip for placing the card/clearfix centre of the browser is to add bother padding and margin as 0 auto.

  Another tip is to add your style to an external stylesheet rather than the HTML file. This makes your code much easier to manage. I like to place my css in its own folder so that I know where it is and it means if yoou have more the one css file it can easly be found.

  Happy Coding!

  1

  ---

  

  Steven Reginald Barkley•70

  @steven-barkleyPosted over 2 years ago

  @rebekahshaw92

  Thank you. I remembered that I could set the max-width and min-with a container and experimented until I found the right size. I also linked the CSS stylesheet for organization and management.

  1
• 

  Brendan•1,120

  @OneManBannedPosted over 2 years ago

  Hi Steven,

  if you remove the margin from .right.

  and add

  body { display: flex; justify-content: centre align-items: centre; min-height: 100vh; }

  That should centre everything thing in the middle of the page.

  1

  ---

  

  Steven Reginald Barkley•70

  @steven-barkleyPosted over 2 years ago

  @OneManBanned Thank you. I have made the local changes and now my Product card is centered. Now I need to make the text responsive so it doesn't spill over and will need to implement a media query or the like.

  Very helpful.

  0