List of Common CSS mistakes and its Fixes.
? Mistake 1 - Using Color name directly.
Fix - We can use color code instead of color name.
?Mistake 2 - Using absolute 'px' Unit?
Fix - We can use 'em' , 'rem' unit which helps to make responsive.
? Mistake 3 - Using unnecessarily long selector.
Fix - We can use simply 'ClassName' instead of unnecessarily?long selector.
? Mistake 4 - Using same code again and again.??
Fix - We can create variables , classes for reusable code which increases the readability of code.
? Mistake 5 - Not Using fallback fonts.
Fix - We can use default font as fallback fonts which help if given font is missing.
? Mistake 6 - unnecessarily?use of '!important'.
Fix - If we link stylesheet with proper order. We do not need '!important'.
? Mistake 7 - Illogical naming for classes and id.
Fix -?We can use BEM naming convention for writing cleaner and more readable CSS classes.
? Mistake 8 - Using Inline , internal CSS.
Fix -?We can use external CSS.
领英推è
? Mistake 9 - Using CSS @import.?
Fix -?We can use CSS:link instead of @import.?
? Mistake 10 - Not organizing CSS.
Fix -?We can use some plugins to auto-organize CSS.
? Mistake 11 - Using Id instead of Classes.
Fix -?We should classes for CSS styling and id for JavaScript selector.
? Mistake 12 - Writing all CSS in one stylesheet.
Fix -?We can create a separate stylesheet for every utility.
? Mistake 13 - Not using CSS shorthand.
Fix - We can use CSS shorthand properties, which makes code more readable.
? Mistake 14 - Writing multiple CSS for removing default browser styling.
Fix - We can use reset CSS which removes default browser styling.
? Mistake 15 - Not validating CSS.
Fix - We can use online CSS validation.
Associate Partner, Practice Leader: IX Customer Transformation at IBM
3 å¹´Awesome , Great stuff
UI Developer | Frontend Developer | ReactJS Developer ?? | HTML | CSS | SASS | BootStrap | Tailwind | React JS | Responsive Web Design ?? | Cross Browser Compatibility | Animation | Accessibility | Performance
3 å¹´Thank you