Make reports go side by side without using knack 3 column limitation

API & Customization Ask Developers
1

Hey there,

I created two reports view, each one in a single column line. This is important as I will use page rules to determine which users will see each report. What I'm trying to do is to make the report from the line below fit the right side of the first report, making them both to be in the same line. So when I have more than 5 reports, it will auto fit the screen according to min-width code.

To make it easy to understand what I need to do, please take a look here:

I want to keep each report in a different Knack view, because I need to set page rules for each report:

But I want the blocks from the first image to go side by side like this:

Does anyone know how can I make it happen, keeping each report in a different knack view?

Tks!


2

Hi Guillherme,

I like the look of the reports you have here. Can I ask what you used to produce that look? I have no coding skills but assuming they are pivot tables with some custom css?

Best regards,

Rob

3

Thank you so much Brad! Worked like a charm.

4

Hi Guillherme,

We do this a lot with views - setting them side-by-side using CSS. Then you can still use rules to show/hide them.

Say you have view_01, view_02 and view_03, your CSS might look like this:

#view_01, #view_02, #view_03 {width: 30%; float: left;}

And adjust the width accordingly to make it look right, and if you have users on small devices you might need to include media rules.

Brad