Lynx
Guide
APIs
Blog
Contribute
Guide
APIs
Blog
Contribute

<percentage>

The <percentage> CSS data type represents a percentage value. It is often used to define a size as relative to an element's parent object. Numerous properties can use percentages, such as width, height, margin, padding, and font-size.

The <percentage> data type consists of a <number> followed by the percentage sign (%). As with all CSS dimensions, there is no space between the symbol and the number.

Examples

<view>
  <text style={{ width: '50%', marginLeft: '20%', backgroundColor: '#00FF00' }}>
    Width: 50%, Left margin: 20%
  </text>
  <text style={{ width: '30%', marginLeft: '60%', backgroundColor: '#FF0000' }}>
    Width: 30%, Left margin: 60%
  </text>
</view>

Compatibility

LCD tables only load in the browser

Except as otherwise noted, this work is licensed under a Creative Commons Attribution 4.0 International License, and code samples are licensed under the Apache License 2.0.