Whitespace in image ion-card

Ionic Framework
1

Hello. I’d like to make a card that is filled completely by an image. However, having only:

              <ion-card>
                <img src="https://dummyimage.com/600x400/1e5c21/fff">
              </ion-card>

Leaves a white space below the image, as the print shows… I tried changing the width/height but nothing seems to have helped. Any way to solve this?

Screenshot_1

2

Ionic actually sort of irrelevant to issue. Apparently caused by blur filter on image. Solved scaling image up as little as possible.

If anyone still has any suggestions on how to better handle this within the scope of ionic cards, feel free to chime in.

3

Hey.

It’s because you’re img is by default “display: inline”. Set it “display: block” and the problem is gone.