1. Establish your media query limit. I recommend a width of 720px as it covers most mobile widths.
2. Analize what needs to change when viewed in mobile. Usually it's page layouts that are made with either flexbox or grid layouts, so those are easy to change. Also make sure that nothing overflows out of its parent, so if you see something weird, then set its max-width to auto
3. Replace absolute units with rem.
The PX unit is the size of a pixel of the device you're using, so something that is set to 500px on one device looks bigger on another. Meanwhile rem is the width of a character, which means that you always a good reference of what it looks like. Normally text size is set to 16px, but you can always change that
That sounds so painful (╥ ᴗ ╥) You got this Mayo!!! ദ്ദി૮₍。•̀ ﻌ •́。₎ა
@fries-and-ice-cream: thank yeww, i neede that :")
1. Establish your media query limit. I recommend a width of 720px as it covers most mobile widths. 2. Analize what needs to change when viewed in mobile. Usually it's page layouts that are made with either flexbox or grid layouts, so those are easy to change. Also make sure that nothing overflows out of its parent, so if you see something weird, then set its max-width to auto 3. Replace absolute units with rem.
The PX unit is the size of a pixel of the device you're using, so something that is set to 500px on one device looks bigger on another. Meanwhile rem is the width of a character, which means that you always a good reference of what it looks like. Normally text size is set to 16px, but you can always change that
4. YouTube has so many tutorials on responsiveness, so go check them out!
@kunfuctusman: THANK YEWW FOR THE HELPFUL INFO!!!!!!
i feel bad