Two issues I'm having with my Tribute Page (and other feedback if you want)

[https://codepen.io/00saadchaudhry/pen/QKYmqK/] (https://codepen.io/00saadchaudhry/pen/QKYmqK)

The two issues concern the three images below. I used bootstrap xs-4 columns to align them.

  1. How can I get more spacing in-between the images, mainly the center one so they don’t look so cramped.
  2. How can I get the center image dimensions to be the same as the the left and right. I tried re-sizing them in an image editor, resizing them in CSS…but none of that was working.

You can try one of the following:

  • Removing the thumbnail classes
  • Remove the thumbnail classes, then nest the image and caption in a <div class="thumbnail">. Then further nest the caption in a <div class="caption">. If that’s unclear consult the bootstrap docs. I think this approach makes the images a bit smaller than simply removing the thumbnail classes.

The only idea in my mind is to use images with the same dimensions in the first place, though iirc there’s some css that you can use to fix this.

I fixed the spacing issues by using col-offset. For the image dimensions i changed the dimensions for the center one in a program.

It’s not exactly what I wanted, but it’ll do for now.