JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
        <div class="inner"></div>
    </div>

CSS

/*问题的关键代码*/
.wrapper{ position:relative; padding: 100px;
    width:20px; height: 20px; min-width: 300px; min-height: 300px; }
.inner{ position:absolute; left:0;top:0;
    width: 100%; height: 100%; }

/*用于增强显示效果的代码，去掉问题依然存在*/
*{ margin: 0;padding: 0; }
body{ height:100%;background: #aff;}
body:after{ content: "body"}
.wrapper{ background: #FFA; }
.wrapper:after{content: "w333rapper"}
.inner{ background: #ddd;}
.inner:after{content: "inner"}