There is a new kind of control that is available only in Abstract Layout Editor. At runtime, it will draw a DIV element in the Web Form.
This means that this table will not have columns with a specific width like in a TABLE element, but will provide much more flexibility.
Each control within the Responsive table will define its width (as a percentage) and its mandatory to specify for each control its percentage width (in TABLE element it wasn't mandatory).
So, you can have a Responsive Table with 2 columns in which two different elements of the same column have different percentage widths, like the following example:
Responsive Table with 2 columns
Control1 (width: 50%) Control2 (width:50%)
Control3 (width: 75%) Control4 (width: 25%
The posible widths (%) for one control within a Responsive Table are:
8%, 17%, 25%, 33%, 42%, 50%, 58%, 67%, 75%, 83%, 92%, 100% (so, it lets you divide some space in up to 12 divisions)
You can configure the width of some control within a Responsive Table for each of the 4 sizes:
- Extra small
In most cases, you will configure two scenarios:
- Extra small for phones
- Small, médium and large for larger browsers. All in just one configuration (by default when you configure something for small size, it is inherited for medium and large)
Also, you will be able to configure whether some control within a Responsive table will be visible or not in each scenario. Both the width and the visible properties are configured by making right click over the responsive table -> Responsive Sizes
Attributes and Variables
In Responsive Web Design, each attribute will contain its description in the same field. So, it is no longer needed to insert a text block next to the attribute control in order to show the field with a description.
With HTML Design
There is a textblock control which displays the description of the attribute. Is independent of the attribute
With Web Responsive Design
The attribute includes its description and has some extra properties:
- Label Position (left, none)
- Label Caption