Overlap rows

[gallagherBD]

Hello, I got some tips to overlap rows on the below mentioned page and when I performed the recent update, that went away.

Here is the website: https://www.source1sys.com/

What I would like is to make the 2nd row overlap the slider.

This was the original CSS that I got from someone elses support question.

@media (min-width: 979px){
.my-class1 .x-column {
margin-top: -100px;
}
Now it formats it in a very odd way.

Can you help?

[jade]

Hey @gallagherBD,

I tried to check the page you have linked but I do not see the class my-class1 applied to any column plus you seem to be using Visual Composer to build the site so x-column would be relevant.

In case you are referring to a section on another page, please direct us to that page so that we can check.

Thank you.

[gallagherBD]

When I use x-column… this is how it looks

I need to be able to center the content and evenly space it.

[christopher]

Hi @gallagherBD,

The row in question does not have the HTML class you mentioned. Please go to the row in question and add the class there in Visual Composer. Here is how to do it:

Element ID and Extra Class Name - Visual Composer Website Builder

After that you will be able to add the CSS code below to X > Theme Options > CSS:

#post-6760 .entry-content > .my-class1 {
    position: relative;
    top: -74px;    
}

At the time being, I had to do some CSS magic and use the position number of teh row to make it work. You can add the code below if you did not add the class:

#post-6760 .entry-content > .vc_row:nth-child(3) {
    position: relative;
    top: -74px;    
}

It is essential to know that the above code is not a right solution as you might add something between the slider and the row in question and teh position of teh row will change and the code will be invalid. The correct solution is adding the HTML class.

Thank you.

[gallagherBD]

Worked perfect! Cheers!

[friech]

We are delighted to assist you with this.

Cheers!