Column Formatting - Question | JoomShaper

Column Formatting

DA

Dina Abramson

SP Page Builder 9 months ago

Would it be possible to show me how I can get this page https://www.accountantswebdesign.us/home-trial to look like the home page at https://www.paulabacks.ca using the various tricks in pagebuilder? The color in the right column connectin gwith the overlay in the top image and the image in the 2nd row overlapping into the left column is what I am looking to create. You can see I tried but I'm obvioulsy missing some steps.

It would really be great if I could get a copy of this page https://www.joomshaper.com/page-builder/interactions so I could import it into a test site to inspect all of the possilbilities and apply them to my use.

Thanks

0
15 Answers
Pavel
Pavel
Accepted Answer
9 months ago #182282

If I do that, the entire row is blue and not just the right colum.

Now I can’t find out why this was happening, since you all redid it. However, Row Fluid may not be a good decision for adaptability.

You did not need to use any settings in the columns. Only a gradient for the section. In my screenshot, you can see that it works.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 9 months ago #181998

Hi

Thanks for contacting us and sorry for your issue. Could you please give me a screenshot of your issue?

-Regards.

0
DA
Dina Abramson
Accepted Answer
9 months ago #182004

I would like https://www.accountantswebdesign.us/images/screen.jpg to look like https://www.accountantswebdesign.us/images/sample.jpg The red circle indicates the area I am trying to give a similar appearance to

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 9 months ago #182087

Hi

You can use this CSS in your custom.css file

#sppb-addon-1616483595962 img {
    max-width: 340px !important;
}
0
DA
Dina Abramson
Accepted Answer
9 months ago #182096

I do not see the image overlapping the column to the left of it where the text is. In fact, I dont see any difference.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 9 months ago #182110

Hi

Sorry for this inconvenience. Could you please keep a full site backup and try this build? We are trying to format this column, please check and let me know.

https://drive.google.com/file/d/1Up5oa7juyXAJVkAwKy3gdrnvsAHc4oyy/view?usp=sharing

0
DA
Dina Abramson
Accepted Answer
9 months ago #182119

Thank you, but I can see you added a row with 2 columns. There is no overlay of the image in the right column over the left colum. You can see in my sample page https://www.accountantswebdesign.us/images/sample.jpg where the background in the right side is blue and the left is green and that the image straddles the two columns. Almost like it is a div overtop of the columns.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 9 months ago #182125

Hello,

There is no option available by default for such feature and it requires modification. Unfortunately, we do not offer modification services. We wish to inform you, however, remain hopeful that you will be able accomplish that layout. Thank you for your understanding.

Best regards.

0
DA
Dina Abramson
Accepted Answer
9 months ago #182130

it is almost like the layout on your crafty template where ryou have an image overtop of the slider at the top and another further down the page. Can that be modified into something like I am looking for?

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 9 months ago #182133

You can try custom CSS on that. You can modify it.

0
Pavel
Pavel
Accepted Answer
9 months ago #182162

The color in the right column connectin gwith the overlay in the top image and the image in the 2nd row overlapping into the left column is what I am looking to create. You can see I tried but I'm obvioulsy missing some steps.

Hi.

Support employees, as always, are "on top." 😱

Just place your content in columns without any background color settings, addon's custom width settings, custom CSS code.

For background color, use a linear gradient in the section settings.

This is exactly what is done on the site from your example

0
DA
Dina Abramson
Accepted Answer
9 months ago #182214

Thanks Pavel. with your steps I am closer and I see the css on the page I was trying to copy.

I am working with this page - https://www.accountantswebdesign.us/en/home-trial

What is confusing is you suggest "For background color, use a linear gradient in the section settings."

If I do that, the entire row is blue and not just the right colum. I placed the background color inside the right colum but as you can see, it does not reach the right side of the page.

0
DA
Dina Abramson
Accepted Answer
9 months ago #182220

seems I was able to correct it by making the row fluid

0
DA
Dina Abramson
Accepted Answer
9 months ago #182347

Yes, I see what you mean. Thank you

0