Archived topic

remove bottom margin in pageheader

7 replies · Started by Marjon Tas on October 24, 2018

Viewing posts 1–8 of 8

October 24, 2018 at 4:46 am #708953

Hi,

I use a pageheader with two columns inside (lightweight grid column) And in the last column I put a shortcode of slideanything, a slider. In the leftside I put some text.

I am trying to get rid of a small margin under the slider. I tried to put an image instead of the slider, but there also is still al little margin beneath. I gave the whole thing a class, and removed allready the 1,5em margin that is normal in the lcg. But still, it is not lining out on the bottom of the slider. Can you maybe help?

Thanks a lot.

Best regards,
Marjon Tas

October 24, 2018 at 5:15 am #708977

Hi there,

did you add an inline-style to LGC columns? They currently have a fixed height of 501px, whereas the images are only 495px which is creating the 6px gap.
The other issue though is the images aren't responsive so when you reduce the width of the browser the image will shrink. Does the slider have the option to make the images responsive?

October 25, 2018 at 3:06 am #709985

Hi David,

Thanks for your reply. I did not add a fixed height in the css. I removed the slider and added an image instead, just for now, to discover what is the problem, and now it still has this 6px gap.
And you are right. The slider was not yet responsive, it had the option. And I have to add some css for the first column in order to make it look right on every width.

Thanks for taking another look,

Best regards,
Marjon

October 25, 2018 at 6:01 am #710074

Hi there,

i can't see the columns now, but the gap that exists now can be removed with this CSS:

.sa_hover_container p {
    margin-bottom: 0 !important;
}
.owl-carousel .owl-item img {
    margin-bottom: -6px;
}

October 25, 2018 at 8:14 am #710327

Hi David,

I am sorry for that, in the meantime a college broke my original code. So I did repaire it just now. Ik added your code in the simple css. Unfortunately it did not fix it. Can you take a look at the website with the repaired code?

Thanks!

Marjon

October 25, 2018 at 8:37 am #710338

I edited the code above, give that a shot

October 25, 2018 at 9:36 am #710371

Hi David,

Yes! that is does the trick.. Super! Thank you very much!

October 25, 2018 at 10:16 am #710397

Awesome. Glad to be of help.

This archived topic is closed to new replies.

Start building better websites today.