x-flexbox

Web Components which provide Flexbox features.

Usage no npm install needed!

<script type="module">
  import xFlexbox from 'https://cdn.skypack.dev/x-flexbox';
</script>

README

x-flexbox GitHub Actions Status

Web Components which provide Flexbox features.

Install

Using npm:

$ npm install x-flexbox

Usage

Import FlexContainer and FlexItem, register them.

<script type="module">
import { FlexContainer, FlexItem } from 'https://unpkg.com/x-flexbox';

customElements.define('flex-container', FlexContainer);
customElements.define('flex-item', FlexItem);
</script>

Put <flex-container> and <flex-item>.

<flex-container flex-direction="column" flex-wrap="wrap">
  <flex-item flex-grow="2"></flex-item>
  <flex-item align-self="stretch"></flex-item>
</flex-container>

License

MIT © Shogo Sensui