Bootstrap img-responsive in columns not center as expected

Aloha Everyone!

This is my first question here :slight_smile:

I have got to the part of the course where I need to create my portfolio. It’s not finished yet, so don’t judge me on the overall thing! What I cant figure out is my images in my “Portfolio” Section. This section is based on 3 bootstrap rows with 2 columns of width 6 in each row. However, I cannot figure out why my placeholder pics in rows 2 and 3 are pushed a little to the right. In row 1 I have 2 pics also that align center just as I want them too, but not sure why the others are pushed a bit right.

Can anyone see where I am going wrong? Thanks a lot!

Here’s my pen

Ok very briefly as I only spent a minute having a looking. You’ll need to close each row with a closing div tag as these are missing for each row, this initially helps although doesn’t center your placeholders. However if you copy and paste the first row into the second row then the images center correctly, which suggests it has something to do with the placeholder image, possibly its being set at a fixed width.

Hope this gets you headed in the right direction

Thank you Joel. I did some copying and pasting like you said, and then I noticed what it was, I hadn’t closed the second img tag in each row with a “>”!

You can use the analyse code buttons in Codepen they are very useful for spotting missed closing tags and verifying your code.

1 Like

Aloha(fellow camper in HI by any chance??) @Darren-Haynes!

Within each of your <div class="col-md-6"> you can add an offset e.g., <div class="col-md-6 col-md-offset-X"> with X being w/e will work to center the column correctly. I found that an offset of ‘3’ works well for centering col-md-6 on the midsize screens. Feel free to take a look at my code starting on line 7. Hope this helps :slight_smile:

Great job on the page btw! Keep it up :smile:


Thanks Joel - I had overlooked that!

Thanks for the help Derek :smile:

Yep I live in Maui, but moving to Seattle at the end of December. What Island are you on?