How to arrange DevExpress controls inline
Sometimes people face questions related to modifying page layout or DevExpress controls arrangement. The most popular questions are:
- why when I place two ASPxButton controls, they are arranged vertically, but when I put standard asp:Button controls, they are aligned horizontally?
- what is the recommended way of creating a page layout?
- why when I place two ASPxButton controls, they are arranged vertically, but when I put standard asp:Button controls, they are aligned horizontally?
- what is the recommended way of creating a page layout?
Almost all of DevExpress controls are rendered
as tables. The main advantage of this approach is that this way provides good
cross-browser capability, since when nested divs are used, it might be hard to
synchronize their positions and sizes for all browsers. However, using tables
allows end-users to get rid of this problem.
e.g If other was selected please open a free
text box to specify . When you want to put ASPxLabel and ASPxTextBox in one
line
Solution use CssClass="DXControlsInline"
[CSS]
.DXControlsInline {
display: inline-table;
}
[ASPx]
<dx:ASPxLabel ID="ckArboviralDiseaseChikungunyaOtherSpecify" runat="server" CssClass="DXControlsInline" Text="Specify:"></dx:ASPxLabel>
<dx:ASPxTextBox ID="tbArboviralDiseaseChikungunyaOther" CssClass="DXControlsInline" ClientInstanceName="tbArboviralDiseaseChikungunyaOther" runat="server" Width="350px"></dx:ASPxTextBox>
The
above two controls will render inline