JavaScript Reference > ons-row

ons-row

Represents a row in the grid system. Use with <ons-col> 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-col, they may not be displayed correctly. You can use only one vertical-align.

See also

Attributes

[improve this]

Attributes are added directly to the element. You can do this in HTML or JS.

HTML: <ons-row someAttribute="true" anotherAttribute><ons-row>
JS: document.querySelector('ons-row').setAttribute('someAttribute', 'true')

Name Type Description
vertical-align String Short hand attribute for aligning vertically. Valid values are top, bottom, and center. Optional.

Need Help?

If you have any questions, use our Community Forum or talk to us on Discord 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.