@Jomagene
Posted
You've done a great job aiming for pixel-perfect accuracy. I especially like the gradient background color on hover, whith a nice shadow. However, on mobile devices, there is a significant gap between the paragraph content and the dismiss button that seems to be missing in your implementation. I also noticed that the container height is larger than in the design. For better responsiveness, consider using min-height
instead of a fixed height, like this:
article {
min-height: 67.5rem;
}
This approach, along with using percentages and padding for internal elements, will help maintain responsiveness. Your use of the <picture>
element with <source>
to handle image responsiveness is excellent too.
Keep up the great work, and let me know if this was helpful or if you'd like to discuss further topics!