Finer control of padding for form layout

Suite and Optimus Suite 6
#1

From all the examples I could find, it looks like the “padding” attribute in form layout configurations only takes a single value, which applies the same padding to all sides of the item. Is there any way to have finer control of the padding, such as being able to apply a padding only to the right side but not the left?

For example, here’s a simplified form config I’m using:

var formConfig = {
    rows: [
        {
            gravity: false,
            cols: [
                {
                    padding: "10",
                    rows:[
                        {type:"select",id:"FormType",gravity:false,label:"Form Type",value:"1",options:[
                            {value:"1",content:"Type 1"},
                            {value:"2",content:"Type 2"}
                        ]}
                    ]
                },
                {
                    padding: 10,
                    rows:[{type:"input",id:"FormNumber",label:"Form Number",required:true}]
                },
                {
                    padding: 10,
                    rows:[{type:"datepicker",id:"CreatedDate",gravity:false,label:"Date Created",required:true,date:(new Date()),dateFormat:"%Y-%m-%d",value:(new Date())}]
                }
            ]
        },
        {
            gravity: false,
            cols:[{type:"input",id:"ResponderName",gravity:false,label:"To:",required:true,width:"100%"}]
        }
    ]
}

This causes the left side of the first field to not line up with the left side of the field on the second row. It’s a minor thing, but I can’t help but notice it. If I take the padding off, then there’s no spacing between the fields on the first line. I thought about just setting padding on the middle item, but then it sits lower than the other two fields on the same line, and that’s even more visually jarring.

I found some documentation on configuring Layouts and setting CSS and such, but that doesn’t appear to apply to forms, so some improved documentation about form layouts indicating the available options for rows and columns would be helpful.

Thank you.

#2

Never mind. I just stumbled across the cellCSS property while trying to figure something else out. I had seen it before, but thought it only applied to the entire form; it only just now clicked that it can be applied at any level of the form config. I was able to create a style for the left column that set the left padding to 0 to match the row below.