Order Summary Component with HTML, CSS, & Flexbox

Community feedback

• 

  Mohamed ELIDRISSI•455

  @elidrissidevPosted about 3 years ago

  Amazing work Aliaa! Not bad for a first challenge. Keep it up!

  For the images problem, it's because of the URL you're using:

  • http://127.0.0.1:5500 is a URL only accessible on your machine when you were running the http server (Using Live Server Vscode extension?).
  • file:///Users/... is a URL used to access files on your local filesystem (Mac in this case) and is again specific to your system and won't work elsewhere.

  So the fix for this is to use a relative URL, in your case it's gonna be ./images/<image name>.

  As for the rest I only have 3 suggestions:

  • Every html page should have a level 1 heading h1 that describes the main content of the page.
  • Consider using semantic html elements instead of generic divs where appropriate, for example the "Cancel" text can be inside a a or a button element because it conveys that it can interacted with.
  • Check the accessibility report page for more.

  Good luck to you!

  Marked as helpful

  1

  ---

  

  Aliaa•25

  @aig0041Posted about 3 years ago

  @elidrissidev Oh yes I was using the live server extension. I didn't realize what the correct URL was though, but i changed it now and it works so thank you so much! I also really appreciate all the suggestions; I'll definitely keep them in mind.

  0

  

  Mohamed ELIDRISSI•455

  @elidrissidevPosted about 3 years ago

  @aig0041 you're welcome!

  0
• 

  María Daniela•185

  @mdagudoPosted about 3 years ago

  Hi! Good job. I noticed you used:

  background-image: url(file:///Users/aliaagabllah/Desktop/Projects/Order_Summary_Component%20_Project/images/illustration-hero.svg);

  in your CSS. That's why you can see it in your computer, but we can see them in the github page. You need to use:

  background-image: url("./images/illustration-hero.svg");

  Because you uploaded the images folder and the .svg to your repo.

  Keep coding!

  Marked as helpful

  1

  ---

  

  Aliaa•25

  @aig0041Posted about 3 years ago

  @mdagudo I changed it and it worked. Thank you so much!

  1