Responsive Recipe Page Basic

Hello, Adrian, By looking at your solution I noticed some issues:

• Use semantic html instead of div and span because they have a special meaning in html structure or you need to assign it manually for each div element the role for example:

<div role="banner">
</banner>
<div role="main">
</div>
<div role="footer">
</div>

I noticed that you used article landmark to wrap as a container. However, it is not appropriate one because it is a main content of the page . In every website one main landmark must exist. I also noticed you used span to make some words to look bold but instead I recommend to use strong element to make words bold it is semantically correct way. at the end you used footer but forgot to change closing tag to it it is still div element. It is important for screen readers.

• In terms of css, I have noticed you tried to use relative unit like rem it is a good practice for accesibility but you need to be consistent. Avoid using absolute units for example pixels. In some places you used them change pixels to rems. Also don't forget to remove the last border-bottom of table header and body.

Overall Good job