Team of Two Demo Content Help

Support
#1

Hello,

I’m working with the Team of Two design cloud template, and am unable to better align our images. How can I prevent them from overlapping? Also, how do I change the line’s color under the image? I’ve tried this code but it yielded no result:

.x-line{
background-color:rgb(0,0,0)!important;
}

View page, then scroll until you see “Meet Our Team”

Thank you!

#2

Hello Mary,

Thanks for reaching out. :slight_smile:

Under Column > Customize > Setup give a class name. After that add following CSS under Pro > Theme Options > CSS:

.align-image .x-image {
    margin: 0 30px;
}

.x-line {
    background: #fff !important;
}

Please change the class name as per requirement.

Thanks.

#3

I’m not completely clear on the solution. Do I assign a class to the whole column or one on the pictures? I assigned the class x-image to the column and input the code put it’s yielding no result.

Also, how can I move the line up higher so the images rest on it?

#4

Hi @marymmccauley,

You should add the x-image class to the whole column. Would you mind providing us with the page URL you’re working so we can take a closer look?

Thank you.

#5

Here it is:

#6

Hi Mary,

Please skip the column class for now, instead, please inspect the first image and set its margin to 0 or greater instead of -1%. That should remove the overlapping issue between the two. Let us know.

Thanks!

#7

Thank you, it worked.

#8

You are most welcome. :slight_smile:

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.