This example adjusts all table and record panels to the width of a page. Override and set the width attribute in the dialog_view class:
/* existing definition in BaseStyles.css */
.dialog_view, .dv { /* panel container (includes panel header) */
margin-bottom: 20px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
padding: 0px;
}
This renders as:
Introduce a new attribute to “dv”:
/* new definition in Styles.css */
.dv { /* panel container (includes panel header) */
width: 100%; /* new attribute added */
}
The figure shows the effect of the newly added “dv” definition (in Styles.css), with a new “width” attribute specified. Note that the edit record panel now spans the full width (100%) of the page, aligning with the Orders table beneath it.
Customizing Style Sheets and Page Styles
Compendium of CSS Classes Used in Applications