I have a very simple question, I have react icon and text in front of it. The text is not aligned with the React Icon. How can I align it with text? Check the screenshot. My code is:
<MdPerson size={20}/><span> Profile</span>
3 Answers
Andriis answer of wrapping it in a flex box combined with the answer from this github issue thread worked for me.
vertical-align: bottom; style on the icon.
As suggested by Andrii, wrap your Icon component & span label in a parent div style the div as below:
<div style={{display: "flex", justifyContent: "center"}}>
<MdPerson size={20}/><span> Profile</span>
</div>
Worked for me perfectly!
Related