Advice App built with HTML, CSS & JavaScript

To resolve those accessibility issue,

• use an h1 instead of h3
• use main for the <main></main> landmark, then <section></section> to set landmark, then use div(s) inside section element.

and you can change api endpoint to https:// api.adviceslip.com/advice/id , then using Math.floor(Math.random * 255) to generate a random number for the id.

Great work and effort, though.

Very nice work @AnniK93 to improve your code, you can do the following

1. use class selector allthrough and avoid styling elements via tag name and id to avoid issues with specificity. for example, add a class(.body) to the body element then

2. center the container by .body{ display: flex; justify-content: center; align-items: center }

3. avoid using static units for font sizes such as pixels but use units that resizes based on browser size such as em or rem.

I hope this helps. Have a nice day.