[Resolved] Carousel – unable to remove left/right borders

[Jacob]

Hi- I’ve tried a couple of methods to add a full-width carousel (both manually coding and using a plug-in), and in both cases I’m left with a narrow border on each side of the carousel. I think that this may be a result of a <div></div> being automatically added to each page, but I’m not sure. Any idea why this is happening? This issue occurs even when the only item on a page is the carousel. Thanks!

[Jacob]

The paragraph break in this post was due to me writing an opening and closing div tag

[Leo]

Edited your post…Can you provide a link to your site?

[Jacob]

Hi Leo- I’m only on a local server at the moment, unfortunately.

[Leo]

It’s a tough for us to tell what’s causing it without seeing the site especially custom codes and other plugins are used…
Maybe give this CSS a shot?

.inside-content-header.grid-container {
    max-width: 100%;
}

[Jacob]

Thanks again for the help. That didn’t solve it, but I went ahead and uploaded an incomplete version of the site to show the issue. The carousel is here: http://deepsang.com/mixes/. Any ideas? Thanks!

[Leo]

Give this CSS a shot:

.container.grid-container {
    padding-right: 0px;
    padding-left: 0px;
}

Let me know.

[Jacob]

Awesome – that fixed it. Support here is top notch, thanks.

On a related note, I’m guessing this type of full width carousel isn’t compatible with the sections plug-in, but can you confirm? Would be great to be able to insert to another page with sections. Thanks again.

[Leo]

I could be wrong but it doesn’t look like that padding is coming from GP. and the page is not currently built with sections?
Anyways I wouldn’t say it isn’t compatible. Sometimes sliders plugins just require a bit of CSS to touch up!

[Jacob]

Right you are. Did a little exploration and got it sorted out. Thanks again!

[Leo]

You’re welcome!

[Author]

Posts