@ag7621
Posted
Hello!
Although I'm pretty new to web dev, I think your project looks great! One tip if I may suggest is centering your card using something like flex
or grid
instead of setting a margin-top
on the body
so that it remains responsive.
The method I use is setting a html, body { height: 100%}
on a css reset. Next is setting the body { display: flex; align-items: center; }
to center it vertically on the page.
The issue I've come across using an attribution
and flex
is that it centers both the content and attribution together. To combat that I've been setting mine as a footer
with the following
.attribution {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
text-align: center;
}
the bottom: 0;
and left: 0;
pushes it to the bottom, and left with width: 100%;
allowing it to take the full width of the page. Lastly text-align: center;
to allow it to center within the width. This resource has helped me in learning how to use flex CSS Tricks - Flexbox
Hope that helps some. Happy Coding!
-Aaron
Marked as helpful
@kylekasprzyk
Posted
@ag7621, thank you for the help! I will try this and check out the article on how to use flex. Thanks!