@SecreSwalowtail
Posted
Hello Kazuha ,
I have some tips that may help you :
-
Avoid using grid for the body. You can use flex to position the main card. Grid is more used when you have complex designs.
-
Avoid using fixed height/width. You can use min-height to give the card a minimum height that will always stay and a max-width to stop it from expanding more than that The content overflows to the left for this reason
-
Try and give the texts in the card a text-align to center them
-
A best practice is to only type CSS rules that you need If you type rules that at first doesn't do anything , later it may conflict with other CSS rules
-
You can look into a reset stylesheet. It removes a lot of headache from images, content not having the right padding/margin etc.
Resources :
- https://www.joshwcomeau.com/css/custom-css-reset/
- https://css-tricks.com/snippets/css/a-guide-to-flexbox/
- https://www.w3schools.com/cssref/pr_dim_min-height.php
- https://www.w3schools.com/cssref/pr_dim_min-width.php
Keep up the work , this is very nice.
