Align several images in a line in the center

Ionic Framework ionic-v3
1

I have three images, loaded one by one, and I need them to be aligned to the center in the case there is only 1 image, then if 2 and then if 3 (that’s ok, it’s full width then). The images are really loaded with ngFor*, this is just an example with static HTML. This is the code I have. Any advice will be highly appreciated!

<div class="photoDiv">
  <img class="photoImg" src="path">
  <img class="photoImg" src="path">
  <img class="photoImg" src="path"> 
</div>

  .photoDiv {
    margin: auto;
    display: block;
    width: 100%;
    height: auto;
  }
  .photoImg {
    margin: auto;
    width: 32.5%;
  }
2

Horizontally or vertically centered?

If horizontally: Just give the .photoDiv a “text align:center;”

2 Likes
3

Thanks, horizontally that worked! I also need vertically. Thanks so much!!!