How to reframe an image?


Hi guys, just a simple question but I didn’t find any info on the forum, how to reframe a photo ?

I mean, I have an ion-avatar tag, and my pic is in landscape mode so it looks compressed in the little circle…
So I just want to reframe it in order to display only the center on the pic, do you understand me? Like that :

But in an avatar…

Thanks !


CSS background properties allow some level of control that can help you achieve this cropping: check this page out first but look also into background-size and other “cousin” properties. I suggest you throw something together and then try to get it right by using a browser inspector and altering the values of those properties while you look at how it affects the result (sorry if this is too basic level, just a tip that might help others doing this)