Lists can help make content really scannable within a long article or complex layout. Choose to display ordered or unordered lists of information as it makes sense to your use case.

Some best practices include

  • Keep list items brief and scannable avoiding long sentences
  • Ideally list items are a few words or one short sentence
  • Avoid using lists within tables (spacing will be enough to differentiate items)

Usage

import List, { Li } from '@nerdwallet/react-list';
<List>
<Li>Alaska</Li>
<Li>Alabama</Li>
<Li>California</Li>
</List>

Loading examples...

<List>

ordered

boolean

Creates a ordered, numbered list.

Default

false

component

any

Allows you to provide a React component or other HTML element, overriding the default `ul` and `ol` options.


children

node

Children inside the <ul> or <ol>. Should be <Li> elements.


className

string

Maintainers

This component is maintained by the FEI team.

See Also