ons-col

Represents a column in the grid system. Use with <ons-row> to layout components.

Usage


<ons-row>
  <ons-col width="50px"><ons-icon icon="fa-twitter"></ons-icon></ons-col>
  <ons-col>Text</ons-col>
</ons-row>

Note: For Android 4.3 and earlier, and iOS6 and earlier, when using mixed alignment with ons-row and ons-column, they may not be displayed correctly. You can use only one alignment.

See also

Attributes

Name Type Default Value Description
vertical-align String Vertical alignment of the column. Valid values are “top”, “center”, and “bottom”. Optional.
width String The width of the column. Valid values are css width values (“10%”, “50px”). Optional.

Discussion

Need Help?

If you have any questions, use our Community Forum or talk to us via Gitter chat. The Onsen UI team and your peers in the community will work together to help solve your issues.

For bug reports and feature requests use our GitHub Issues page.