the name of a CSS class(es) applied to Layout
<style>
.my_first_class {
/*some styles*/
}
.my_second_class {
/*some styles*/
}
</style>
var layout = new dhx.Layout("layout_container", {
css:"my_first_class my_second_class"
});
The DHTMLX library provides a set of CSS classes that you can apply to change appearance of the Layout cell.
var layout = new dhx.Layout("layout", {
css: "dhx_layout-cell--bordered",
rows: [{
id: "toolbar",
html: "Header",
css: "dhx_layout-cell--border_bottom layout-header",
gravity: false,
height: "60px"
}]
});
dhx_layout-cell--bg_white | Sets white background to a layout-cell |
dhx_layout-cell--bg_gray | Sets gray background to a layout-cell |
dhx_layout-cell--bordered | Sets borders on all sides of a layout-cell |
dhx_layout-cell--border_top | Sets a border on the top side of a layout-cell |
dhx_layout-cell--border_bottom | Sets a border on the bottom side of a layout-cell |
dhx_layout-cell--border_left | Sets a border on the left side of a layout-cell |
dhx_layout-cell--border_right | Sets a border on the right side of a layout-cell |
dhx_layout-cell--border-shadow | Adds a shadow border to a layout-cell |
dhx_layout-cell--no-border_top | Removes the top border of a layout-cell |
dhx_layout-cell--no-border_bottom | Removes the bottom border of a layout-cell |
dhx_layout-cell--no-border_right | Removes the right border of a layout-cell |
dhx_layout-cell--no-border_left | Removes the left border of a layout-cell |