JSFiddle - React, Tailwind, and code Playground

HTML

<div style="width:max-content;display:flex;border: 1px green solid;">
    <div style="height:100px;flex:0 0 100px;border: 1px red solid;width:200px">Why parent div has more width than child?
  </div>
</div>