html - css 最小宽度不能正常工作

Question

我正在尝试使用以下代码将一个 div 定位在另一个 div 的中心:

<div style="width:100%; height: 300px; background:red;">
  <div style="margin:auto; min-width:50%; height:100%; background:green;">Text</div>
</div>

它会产生一个宽度为 100% 的绿色大 div。不过我预计它会是 50%。有人能告诉我为什么 css 不给它 50% 的宽度并居中吗？

Answer 1

更新的答案

<div style="width:100%; height: 300px; background:red; text-align: center">
      <div style="min-width:50%; display: inline-block; height:100%; background:green;">Text</div>
</div>