@extendmeans that the element just get a comment where the extended class was previously.
inline svg styling is preferred – think of it like an iframe.
gradients are crazy powerful: You can specify that the white area at the bottom starts at 50% from the bottom as specified here –
background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,0.8) 50%, rgba(255,255,255,1) );. And you can repeat it to make like a rainbow effect. Really cool.
- if things are longer than expected -> it will overflow with abosolutely positioned
- more predictable behavior for overflow
box-sizing: border-boxincludes padding but not margin in the width measurements.