css - 如何使我的图像内嵌在组件内容的左侧？

Question

我有一张图片，其中包含有关它的详细信息，例如标题。谁能告诉我如何使其内联并位于其他内容的左侧？附上一张图片来解释我正在尝试做的事情。

return (
    <div key={obj.employee}>
        <p>{obj.employee}</p>
        <p>{obj.favDog}</p>
        <img alt={obj.favDog} src={obj.img} />
    </div>
)

标签： cssreactjs

Answer 1

只需添加display: flex;到您的外部容器中，所有东西都应该很好地放置！

这是一个演示小提琴

然后，您可以根据需要添加边距和其余样式。希望有帮助

如果你想了解更多关于 flexbox 的信息，这是一个很好的参考。还有MDNflexbox文档。