Can't center image with bootstrap



I’m having a really hard time centering my image and its caption with Bootstrap 3 via Codepen. Here’s my code:

<div class="img-thumbnail">
          <img src="" id="anne-frank-img" /*>

          <div class="text-center">A photo of Anne captured during her younger years.</div>

Here’s a link to my pen. Hope you can help out a beginner!



You need to wrap the photo and caption in another div with a class of text-center. Also, you have an asterisk at the end of your img tag you need to remove.


That worked perfectly. I’ve been stuck in fixing that image for more than an hour. Thanks cndragn!


Awe! Glad I could help!!! :blush: You’re off to a great start with this!!

A little something I saw… be mindful of how you use your h1, h2, h3 etc tags… they are not styling tags, but h for header header tags, like for the title of a section …but you are are using them inside of your ul (unordered list).

Consider, if your website needed a page of contents, the header tags would be the chapter titles for each section.


Realized that I forgot to put a closing tag in my ul (which led to the other elements below it being counted within ul). Thanks for pointing that out!


Those meddling unclosed tags!!! :laughing: Glad you found the problem!!!