@orphandeity
Posted
Wow, your project looks great!
Looking at your code, I think you would benefit a lot from using responsive units like em and rem. These units are based on the font-size and will help keep things consistent and prevent you from having to think with pixel-perfect precision. They are used in place of px and are great to use for margin, padding & font-size. When you are first learning about these units, I would start with and focus on rem and then use em when you need more control.
There are also responsive units that are based on the window size... these are vh and vw. To illustrate, 100vh is equal to the entire height of the window and would effectively make the element fullscreen. 50vh would make the element take up half the window and vw does the same thing for width.
Here is a really good article on the subject of viewport units.
Marked as helpful
@alihaydar28
Posted
@orphandeity thanks for taking the time to reply. Sure i will look into the stuff you mentioned !