Column

in namespace DotVVM.Framework.Controls.Bootstrap

Renders a Boostrap column. Use this control inside the Row control.

Usage & Scenarios

Renders a Boostrap Column. Use this control inside the Row. http://getbootstrap.com/css/#grid

Sample 1: Column Sizes

You can specify the size of the Column (in the Bootstrap grid system) for each screen size by setting the following properties:

  • SizeXS
  • SizeSM
  • SizeMD
  • SizeLG
  • SizeXL
<bs:Column SizeXS="4" SizeLG="10" style="background-color: red">XS = 4/12 | LG = 10/12</bs:Column>
<bs:Column SizeXS="8" SizeLG="2" style="background-color: blue">XS = 8/12 | LG = 2/12</bs:Column>

Sample 2: Column Offsets

To shift the column to the right use the following properties:

  • OffsetXS
  • OffsetSM
  • OffsetMD
  • OffsetLG
  • OffsetXL
<bs:Column SizeXS="7" SizeLG="2" style="background-color: blue">no offset</bs:Column>
<bs:Column SizeXS="5" OffsetLG="4" SizeLG="6" style="background-color: red">offset = 4 for the large screen</bs:Column>

Properties

Name Type Description Notes Default Value
property icon ClientIDMode ClientIDMode Gets or sets the client ID generation algorithm.
attribute
inner element
static value
bindable
default
1
property icon DataContext Object Gets or sets a data context for the control and its children. All value and command bindings are evaluated in context of this value.
attribute
inner element
static value
bindable
default
null
property icon ID String Gets or sets the unique control ID.
attribute
inner element
static value
bindable
default
null
property icon InnerText String Gets or sets the inner text of the HTML element.
attribute
inner element
static value
bindable
default
null
property icon OffsetLG int? Gets or sets the offset of the column in the LG mode.
attribute
inner element
static value
bindable
default
null
property icon OffsetMD int? Gets or sets the offset of the column in the MD mode.
attribute
inner element
static value
bindable
default
null
property icon OffsetSM int? Gets or sets the offset of the column in the SM mode.
attribute
inner element
static value
bindable
default
null
property icon OffsetXL int? Gets or sets the offset of the column in the XL mode.
attribute
inner element
static value
bindable
default
null
property icon OffsetXS int? Gets or sets the offset of the column in the XS mode.
attribute
inner element
static value
bindable
default
null
property icon SizeLG int? Gets or sets the horizontal size of the column in the LG mode.
attribute
inner element
static value
bindable
default
null
property icon SizeMD int? Gets or sets the horizontal size of the column in the MD mode.
attribute
inner element
static value
bindable
default
null
property icon SizeSM int? Gets or sets the horizontal size of the column in the SM mode.
attribute
inner element
static value
bindable
default
null
property icon SizeXL int? Gets or sets the horizontal size of the column in the XL mode.
attribute
inner element
static value
bindable
default
null
property icon SizeXS int? Gets or sets the horizontal size of the column in the XS mode.
attribute
inner element
static value
bindable
default
null
property icon Visible Boolean Gets or sets whether the control is visible.
attribute
inner element
static value
bindable
default
True

HTML produced by the control