Awesome job Tiana ! Apart from the overall sizing (which can be hard to know just by looking at the initial design photo), it looks exactly the same. You should definitely be very proud of this solution !
Something you might find useful is you can use flexbox to center the content no matter the viewport size. By using the following code:
body {
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}
You can remove the one minor HTML validation error by swapping
<h2 role="heading" class="heading text-color-darkgray">Summary</h2>
for
<h2 class="heading text-color-darkgray">Summary</h2>
Don't quote me on it but I think <h1> - <h6> tags don't require role="heading" as by using that tag it already signifies anything contained is a heading.
Happy <coding />
Marked as helpful
2
