What is the meaning of this code? Please explain why this has to be in my codes?
*, *:before, *:after {
box-sizing: inherit;
}
It is ensuring that all elements plus all decorator elements inserted before or after elements will: include padding and border in the element's total width and height.
This is useful for example if you have javascript that needs to measure the size of an element and you want to make sure that measurement will always include padding and border widths.