Posts

Showing posts from May, 2024

Level up your CSS with this one trick!

Image
 I'm sure you have heard of people saying as long as you can make website look the way it should be, then it doesn't matter how you code them out. But there are a few concerns about this, we have not taken into account of: Maintainability Readability of code Reusability of code Let us say we want to create a layout like this: For those people who are new to CSS, they might style their HTML and CSS as such: Before CSS: * , * ::before , * ::after {     box-sizing : border-box ; } body {     display : grid ;     min-height : 100vh ;     margin : 0 ; } .box1 {     background-color : green ;     color : greenyellow ;     margin : 3rem ; } .box2 {     background-color : blue ;     color : lightblue ;     margin : 3rem ; } .box3 {     background-color : red ;     color : lightgoldenrodyellow ;     margin : 3rem ; } Before HTML: <! DOCTYPE html > ...