Content Slider Dot Padding

Beaver Builder
1

Hi,

It appears that when you set show arrows to yes, the height of the encompassing row is increased to hold the dots… The padding is quite large… .like 40px. I cannot seem to find a way to stop this behavior. Is there a way to reduce the padding or eliminate it completely by moving the dots up into the slides like the arrows? I am using genesis, dynamik + the beaver builder plugin and have loaded the custom css and php to enable full width.

You can check the behavior out here…

http://staging.proactivepatents.com

Thanks,

Keith

2

Hey Keith,

This CSS should move the dots up into the slider for that request:

.bx-pager.bx-default-pager {
  bottom: 10px;
}

You’ll then need to decrease the bottom module padding to bring up the rest of the content underneath. Let me know if that helps!

Best,
Billy

3

[Content Hidden]

4

Hey Keith,

This should work for that padding (adjust the 40px to your liking):

.fl-module-content-slider .bx-wrapper {
  margin: -4px auto 40px;
}

Re. the initial CSS I sent, that appears to work in our theme, but you may need to add !important. Let me know how that goes!

Best,
Billy

5

The following worked in the Dynamik Custom CSS… Dots are moved up and row padding is gone.

.bx-pager.bx-default-pager {
bottom: 10px !important;
}

.fl-module-content-slider .bx-wrapper {
margin: 0px !important; auto 0px !important;
}

Thanks!

Keith

6

Excellent, good work!