react-inline-center

Centering inline elements like magic:

• No need to add the wrapper element
• The child element (image, icon etc.) can be any size
• Only align to the first line of adjacent text

Install

npm install react-inline-center

Demo

• https://stackblitz.com/~/github.com/ambar/react-anything
• https://codesandbox.io/s/react-inline-center-hu81q

Usage

import InlineCenter from 'react-inline-center'

render(
  <>
    <Button>
      <InlineCenter>
        <MyIcon />
      </InlineCenter>
      label.
    </Button>
    <p>
      <InlineCenter>
        <image />
      </InlineCenter>
      text.
    </p>
  </>
)