16
Views
8
Comments
How can I remove the spaces from the columns?

Hi,

I have validations and there are empty spaces in the column. I am using the widget Columns4

¿How can I remove the blanks?


Thanks.


Rank: #55

Hi Josep,


If you are using Columns4 widget, you want to distribute your content through columns and you can do that by placing the content inside the Column1, Column2, Column3 and Column4 placeholders (see Widget Tree below):


Additionally, you can control the gutter size (space in between columns), you just have to make sure you referenced the GutterSize static entity from OutSystemsUI. You have an option there None (as you see in the image) but there are others with different space sizes.


Hope it helps.


Regards,
João

Hi João,


Thank you for you message but...I have not solved the problem, I still get 2 empty spaces :(

Regards,

Rank: #55

Can you share your Widget Tree?

You should have only 1 widget Columns4 and spread the content among the Column1, Column2, Column3 and Column4 placeholders as on screenshot shared above.

Rank: #55

If you just want 2 columns, why don't you use the Columns2 widget, instead?

I have a 4 column "widget" because I have 4 fields, one per column, but due to validations only 2 are visible and they look separate.

My idea would be to remove that blank space. It's possible?

Rank: #55

Hi Josep,


Yes, you would have to have the hidden fields hidden by an If and to use CSS to make the columns to disappear if they are empty.

So if your first and fourth column are filled, you want the second and third column to disappear.

For that, you should place the below CSS on your Theme:


.columns-item:empty {

    display: none;

}


Nope..not fixed, attached screenshot and style added

Does it happen to you?

Thanks!!