Question

space between tables in a section

Forms

Updated May 23, 2016

asked on May 23, 2016

Hi,

I have a section where I have various tables...

I want to reduce spacing between tables, in order to make it look like as if there is only one table.

As you can see in screenshot, the table Showroom is one table & Lager is basically 2 tables inside a collection, I want the Lager to look like Showroom!!! In terms of spacing....

Can anyone please help to achieve this?

Regards,

Sahil

Screen Shot 2016-05-23 at 10.07.55.png (58.55 KB)

| Download

0 0

Answer

SELECTED ANSWER

replied on May 23, 2016

There are two tables there, this screenshot should help clarify things:

The exact CSS I used was (Table2's class was "table2"):

.table2 .cf-section-header {display:none;}
.table2 .cf-col-label {display:none;}

You can see that the row names still rename for me, so I would make sure you don't have any other code that might interfere with it.

0 0

Replies

replied on May 23, 2016

Are you concerned about the spacing between "Big Vanilla" and "Small Vanilla" row in the "Lager" table? By default, the spacing by should be the same for all the rows in different the table. How does the Showroom table differ from the Lager table? You mentioned Lager table is inside a collection, but tables cannot be stored in a collection.

The only time I have seen a gap like yours if the row name is quite long, please check for any possible hidden characters in your row name. I would also check whether there isn't some CSS interfering with your second table.

0 0

replied on May 23, 2016

As you can see in screenshot, the table Showroom is one table & Lager is basically 2 tables

Forget collection, that was my mistake,

Only question is, can space be reduced between 2 tables in a section...

0 0

replied on May 23, 2016

By hiding the table name and column names, i was able to reduce the spacing to this:

CSS used to hide the table name and column names were:

.cf-section-header {display:none;}
.cf-col-label {display:none;}

0 0

replied on May 23, 2016

Sorry Cathy,

You were right, it worked even on having different tables, all I had to do was give them same class & then it reduced the space also & looks perfect!!!

Thanks a Million!

0 0

replied on May 23, 2016 • Show version history

I guess I marked too soon :(

Is it possible to target only Column Header & not row label?

.cf-col-label {display:none;} this remove row labels also....

Apart from that, I want the First row to have column names....

0 0

replied on May 23, 2016

Cathy,

It's not one table, it's more than one table.

What you are having is only 1 table....

0 0

SELECTED ANSWER

replied on May 23, 2016

There are two tables there, this screenshot should help clarify things:

The exact CSS I used was (Table2's class was "table2"):

.table2 .cf-section-header {display:none;}
.table2 .cf-col-label {display:none;}

You can see that the row names still rename for me, so I would make sure you don't have any other code that might interfere with it.

0 0

replied on May 23, 2016

Cathy,

Can you please try 3 tables & all having 1 row each?

End result should be that they should look like 1 table, meaning 3 rows (look like 3 rows are there in 1 table).

0 0

replied on May 23, 2016

Thanks Cathy!

0 0

You are not allowed to follow up in this post.

Question

Question

space between tables in a section

Answer

Replies

Sign in to reply to this post.