Common CSS Mistakes every Developer should avoid🎨
🧵👇
🧵👇
1️⃣ Using px
Px locks your design to a fixed size for all screens.
You should always try to use relative measurements such as em, rem, %, etc and wherever possible.
Px locks your design to a fixed size for all screens.
You should always try to use relative measurements such as em, rem, %, etc and wherever possible.
2️⃣ Using one CSS file for styling
Using single file in big projects can create mess.
Try to use different CSS files for different components.
For example: Create 2 different CSS files for navbar and footer. This will also increase the reusability of code.
Using single file in big projects can create mess.
Try to use different CSS files for different components.
For example: Create 2 different CSS files for navbar and footer. This will also increase the reusability of code.
3️⃣ Using inline CSS
You have to write the same code again & again for different elements, there is no place to put these styles for reuse.
Since there is no specific location for code, editing inline CSS is a task!
Always try to use external stylesheets until needed.
You have to write the same code again & again for different elements, there is no place to put these styles for reuse.
Since there is no specific location for code, editing inline CSS is a task!
Always try to use external stylesheets until needed.
4️⃣ Using !important everywhere
The only thing that can override an !important is another !important, and once you go down that road, it never stops.
There's no point in jamming your CSS with a lot of !important styles and become gridlocked.
The only thing that can override an !important is another !important, and once you go down that road, it never stops.
There's no point in jamming your CSS with a lot of !important styles and become gridlocked.
5️⃣ Not using proper naming convention
Make sure to name classes, ids and other attributes properly and in a similar manner.
Try storing color values in variables instead of copying same color over and over again.
Make sure to name classes, ids and other attributes properly and in a similar manner.
Try storing color values in variables instead of copying same color over and over again.
6️⃣ Not designing beforehand
It feels amazing to just start building without thinking much, but this can turn in a mistake once things get complex.
Try to have a clear picture of project. It'll also reduce the chances of redundancy.
It feels amazing to just start building without thinking much, but this can turn in a mistake once things get complex.
Try to have a clear picture of project. It'll also reduce the chances of redundancy.
7️⃣Being too creative
Tbh, you don't need heavy CSS or animations forced into your website. Elegant design with good UX/UI is preferred by everyone.
Don't try showing all your skills in one project only.
Tbh, you don't need heavy CSS or animations forced into your website. Elegant design with good UX/UI is preferred by everyone.
Don't try showing all your skills in one project only.
Loading suggestions...