Available only in PRO Edition

AbsoluteLayout

The AbsoluteLayout view presents a layout that allows specifying the exact location of elements inside it, without using usual rows/columns configuration.

The child elements are placed into layout's cells and their sizes are set by hardcoded values. For each child view the exact top and left positions should be specified:

webix.ui({
    container:"layout_div",
    view:"abslayout",
    cells:[
        { view:"text", label:"Name", labelAlign:"right",
            top: 100, left:350, width:200, height: 40 },
        { view:"text", label:"Email", labelAlign:"right",
            top: 100, left:550, width:200, height: 40 },
        { view:"textarea", label:"My text box", labelPosition:"top",
            top: 140, left:100, width:650, height: 100 },
        { view:"button", label:"My text box",
            top: 260, left:260, width:400, height: 40 }
    ]
}).show();

Related sample:  Layout with Absolutely Positioned Elements

Back to top