[Resolved] How to wrap a bunch of rows and apply CCS on that bunch

[Author]

Posts

[ericM-11]

Hi
I'm working on a project on a Divi website on which I developped a template which looks that way : hidden link

I bought the Toolset plugins in order to deal with custom post types and I'm trying to "clone" my divi template with Toolset Layout.

Here is my issue : I found the way to apply CSS to cells, but in order to stay close to my Divi based template, I need to wrap a bunch of rows in a border (the one with shadow you can see in my above screenshot).

How can I do that with the Toolset Layout template editor ?
Thanks

[Christian Cox]

Hi, it might be possible to use a Grid of Cells to contain the rows, then apply the shadow effect using a CSS class on the row containing the Grid of Cells. See the attached screenshot for an example. I added a row to the Layout, then inserted a 1x3 grid of cells into that row. If you click the pencil icon at the top right, you can add a CSS class to the row that holds the grid of cells. Depending on how your design is configured, this may work for you. If not, please show me some additional details that describe the problems you encounter.

[ericM-11]

Hi Christian,
well, I saw this "grid of cells" opportunity before I opened my ticket, but the problem is that, as you can see in my divi template, each "child" row needs to have its proper number of cell.
With Toolset layout, I have to choose if its 2 cells per row or 3 cells per row for the whole grid, and then I can't customize the width of each cell can I ?
Have you any idea of how I could do with Toolset Layout to build a template who would look like my Divi template ?

[Christian Cox]

I see, the grid of cells isn't really appropriate for your case. One other approach is to use a nested, or parent / child, Layout. The parent Layout would include the top CONSULTATION D'UNE OFFRE message in the top row (row set to "Row as wide as Bootstrap .container, its background extends to full width"), and the 2nd row would include a child Layout cell. You can apply the shadow CSS class to the 2nd row.

Then you would create a new Layout that includes everything in the shadowed area, designed on the standard Layout grid without the need for a grid of cells. Assign the correct parent Layout, and assign the child Layout to the post or page where you want to display this design.

Would this give you the flexibility you need?

[ericM-11]

Ok, I have to dig in that way. I've just bought the plugin and didn't explore everything. I'll go into it tomorrow and get back to you if necessary.
Thanks for your insights and have a good night.