How to set padding or margin indivisual widgets.

Webix JS
#1

Layout has padding properties. but each child doesn’t have it.
We want to set padding or margin specific child.
But there is no property for that.
So I set CSS for that. but It makes another effect.
In the sample. https://snippet.webix.com/cfzvotb4
for ‘dtable2’ If I set margin-left, regardless of margin-right, right edge gets hidden.

Is there any good way for set padding or margin indivisually?

Second question.
I don’t know the rule of setting border.
Webix has borderless property. but I can’t find set border each edge.
border-left? border-top?
and Depending situtation, sometimes border-left ON? sometimes off, other edge as well. What is the rule? and Can I set indivially?
If I set by CSS, something that I don’t want heaven. for example, If I set border left 1px, right side 1px is hidden.

Thank you for reading my question.

#2

Hello,
Yeap, it’s possible to use padding and margin in layout. Datatable doesn’t support such properties. As a solution, you can try to use ui.spacer.
As to the question about borders. It’s possible to define different border types. You can find information here.

#3

Thank you. Nastja

                cols: [
                    {
                        cols:[
                            {
                                rows: [
                                    gridTB8000device.wbGrid,
                                    gridTB8000device.getPagerConfig({height: 32}),
                                ]
                            },
                            {width:4}, <- it is ui.spacer. isn't it?
                        ]
                    },
                    {view: "resizer", borderless: true},

This code intend to make horizontal space from gridTB8000device.wbGrid and resizer.

Is this right way to use spacer?

#4

Hi @sean,

Yep, this is the correct approach.
The spacer will be automatically initialized once you declare an object without view property. Still, you can type view:"spacer" as well.

In order to clarify the available options, please refer to the following snippet:

Code Snippet