Posts

Showing posts from January 26, 2019

CSS - Circle with letters in the middle

Image
1 I'm trying to do this As you can see, the icon is not centered. I want the circle to be "pulled up" a bit so it looks nice. Here is my html (angular): // Icon component <div> <i><ng-content></ng-content></i> </div> // Parent Component <div> <p>Connect with <app-initials-icon>OT</app-initials-icon> {{ contact }} </p> </div> // For Simplicity (ignoring angular, so you can ignore above if you're not familiar) <div> <p>Connect with <div> // the div that the css below applies to <i>OT</i> </div> </p> </div> Here is my css div { display: inline-block; } div i { text-align: center; border-ra