I’m working on an app where I want to line up a flag with a line of text. Here is a bit of my template code:
<p>{{ number }} - Call is originating from the {{ c }} <img src={{ url }} /></p>
When it renders, it looks a bit like this:
How can I get this flag to line up with the “US” text?
Is it possible to provide a bit more code, like the surrounding wrapped elements or styles associated with the <p> tag or the <img> tag because I just tried the snippet you gave in a CodePen, and by itself it looks alright:
<p>
<img>
Edit: a full width screenshot might also help to get sense of the page’s margin and size.
You might try vertical aligning the image i.e. style=‘vertical-align:middle’ to see if that is enough
Try using css flexbox:
display: flex; align-items: center; justify-content: center;