Centering bootstrap carousel

Question

When this site was last edited 3-4 months ago, I think I remember the images being centered on desktop, with gray bars on either side. I just learned that is no longer the case. Perhaps bootstrap was updated? Or I just have a faulty memory. In any case, I seem to be missing something and would like to center the images horizontally.

2017 Festival Photos | Durham Blues & Brews Festival

Somewhat related, the images are on the small side at 640px wide. A later edit project is to build multiple sizes using srcset. An article referenced on this forum is from 2014. Is it still a recommended method in 2017 (nearly 2018)?

BenPleysier · Accepted Answer

Add either of the following two style rules to the bottom of your CSS

If you want the image to expand full width - no centering required

.carousel img {
width: 100%;
height: auto;
}

If you just want to center the image

.carousel img {
margin: auto;
}

Nancy OShea · Answer

What's this for?

It's 404 Not Found. And besides, GetBootstrap is not a CDN.

Bigger images would help a lot. Try adding this to your custom CSS.

.carousel-inner img {width:100%; height:100% !important}

And don't forget to fix your code errors.

Showing results for http://www.durhambluesandbrewsfestival.com/photos/2017.htm - Nu Html Checker

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.