I had the hardest time with this project! I'm proud of the HTML and that's it!
What challenges did you encounter, and how did you overcome them?My challenges was the with the CSS and JavaScript. I couldn't get either one right!
What specific areas of your project would you like help with?CSS and JavaScript
Hey, nice job! A couple of things I'd do different with the CSS. I wouldn't use ids to style elements. Since ids shouldn't be repeated, you couldn't reuse that style. I would always create a class to add style, even if the class and id names end up being the same. Another thing that I noticed that makes CSS very hard to work with is the media queries with max-width. When you follow a 'mobile first' approach (min-width) things tend to flow better since you don't have rules overlapping each other when you don't want. Write the mobile layout first and add media queries with min-width for the changes in other breakpoints. :)
Nice work! I would just remove 'avatar profile jessica' from the alt text of the avatar image. Images that are content-irrelevant should have an empty alt attribute (atl="") so screen readers would ignore them. I like to refer to this post from WebAIM when I'm in doubt about alt texts https://webaim.org/techniques/alttext/
Nice!
On line 28 of your code, if you don't want to use inline style, you can add box-shadow with Tailwind like this: shadow-[8px_8px_0_0] or extend a new shadow value in tainwind.config.js.
Nice pixel perfect.
