Css 元素不会在模态内部居中

我目前正在使用React引导模式。我试图用flexbox将一个元素集中在一个模态中，但这样做有很多困难。下面是我的代码，以及它当前的外观

导出默认欢迎项

您正在图像中应用flex以对齐it中心…这是错误的

Flex始终应用于父容器，以便其子项使用Flex功能

将图像包装在一个div中，然后将display:flex和justify-content:center应用于该div，使图像居中对齐

<div style={{display: 'flex',justifyContent: 'center'}}>
  <img src="pic.png"></img>
</div>

---

您可以尝试使用flex和CSScan将元素居中，粘贴呈现的HTML？与CSS一起？@acampbe222应该可以工作……确保呈现的html与上面的示例类似……尝试将宽度：100%应用于该div，只是发布了一张它是如何工作的图片looks@acampbe222你能在控制台中分享呈现的html的屏幕截图吗？请将问题提交给新图片@Bhuwan@acampbe222为什么您的文档中有宽度和高度值.modal class div。。。？

<div style={{display: 'flex',justifyContent: 'center'}}>
  <img src="pic.png"></img>
</div>