我需要一个简单的主div列100%满。
有时会出现一个侧边栏，具有动态宽度。
在这个示例中，您可以看到我无法更改侧栏宽度（每次都有一个新的宽度值），并且我无法将主div“拉伸”到100%的宽度。
怎么办？
<div class="min-h-screen grid grid-cols-12">
<div class="bg-green-500">
<div style={`width: ${randomWidth}px !important;`}>
Sidebar. This has dynamic width.
</div>
</div>
<div class="bg-red-500">
Main. This has full width.
</div>
</div>
我建议简单地使用相对和绝对。这是codesandbox
<div class="min-h-screen w-full relative">
{#if sidebarVisible}
<div class="bg-green-500 h-full absolute left-0">
<div style={`width: ${randomWidth}px !important;`}>
Sidebar. This has dynamic width.
</div>
</div>
{/if}
<div class="bg-red-500 h-screen">
Main. This has full width.
</div>
</div>
对于100%宽度，可以使用w-full；对于全屏高度，可以使用h-screen
