@patternfly/react-core/src/layouts/Split/examples/Split.md

This library provides a set of common React components for use with the PatternFly reference implementation.

---
id: Split
cssPrefix: pf-v5-l-split
section: layouts
propComponents: ['Split', 'SplitItem']
---

import './split.css';

## Examples
### Basic
```js
import React from 'react';
import { Split, SplitItem } from '@patternfly/react-core';

<Split>
  <SplitItem>content</SplitItem>
  <SplitItem isFilled>pf-m-fill</SplitItem>
  <SplitItem>content</SplitItem>
</Split>
```

### With gutter
```js
import React from 'react';
import { Split, SplitItem } from '@patternfly/react-core';

<Split hasGutter>
  <SplitItem>content</SplitItem>
  <SplitItem isFilled>pf-m-fill</SplitItem>
  <SplitItem>content</SplitItem>
</Split>
```

### Wrappable
```js
import React from 'react';
import { Split, SplitItem } from '@patternfly/react-core';

<Split hasGutter isWrappable>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
  <SplitItem>content</SplitItem>
</Split>
```