Quick-fire CSS Solutions
Five easy ways to solve common CSS issues
I thought I’d put together a set simple methods to solve common CSS issues. They are simple and quick-fire and can be implemented with minimal code.
Smoothen out fonts
Remove jagged pixels from your text using rotation
transform: rotate(-0.0000000001deg);
This property will smoothen out your fonts by performing a minuscule rotation. It works well with all major browsers.
Centering an absolute element
Dialogue boxes and notifications can be centered quickly by aligning their position across all dimensions.
bottom: 0; left: 0; top: 0; right: 0;
margin: auto;
position: absolute;
Center align text vertically
You can align text vertically to the center of the page without using padding.
.parent { display: table;}
.child { display: table-cell; text-align: center; vertical-align: middle;}
Truncate multi-line strings properly
These properties work well with Webkit browsers and can be used to truncate multi-line text on a webpage.
display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
Follow me for more updates :)