horizontalCenter in Bootstrap button not working

[GHEMID-Mohamed]

import { Button } from 'reactstrap'
import Icon, { horizontalCenter } from 'react-icons-kit';
import { ic_looks_one } from 'react-icons-kit/md/ic_looks_one'

const MyButton = horizontalCenter(props => <Button>{props.children}</Button>)

<MyButton>
hello world   <Icon icon={ic_looks_one} />
</Mybutton>

[GHEMID-Mohamed]

I added style={{ verticalAlign: 'middle' }} in Icon and it worked for me :)

<Button color="primary>
  <Icon
     style={{ verticalAlign: 'middle' }}
     icon={ic_info_outline}
     id="UncontrolledTooltipExample"
     size={20}
 />
</Button>

[wmira]

@HamadaBrest good that you have it worked out. Will take a look at this again. Usually you need to wrap the items with some something that would center the content. I will be deprecating the horizontalCenter and be replacing it something much less confusing to use.

Closing for now.