CSS网格布局能否用于实现编辑器窗格的大小调整（例如，在CodePen中）

我想实现没有JS的可调整大小的窗格，只使用。这可能吗

例如，CodePen的编辑器为其HTML/CSS/JS编辑器提供了可调整大小的窗格。另外，请参见下面的示例，它在纯JS中实现（我似乎无法在其中的CodePen示例中添加URL，因此添加属性有点困难。代码是通过）

let isresising=false；
让$handler=document.getElementById（'handler'）；
让$wrapper=document.getElementById（'wrapper'）；
让$left=document.getElementById（'left'）；
$handler.addEventListener（'mousedown'，函数（e）{
IsResising=true；
});
document.addEventListener（'mousemove'，函数（e）{
如果（！IsResising）返回；
让newWidth=e.clientX-$wrapper.offsetLeft；
$left.style.width=newWidth+'px'；
});
document.addEventListener（'mouseup'，function（）{
IsResising=false；
});
html，正文{
身高：100%；
宽度：100%；
保证金：0；
}
#应用程序{
身高：100%；
/*最大宽度：1400px*/
保证金：0自动；
}
标题{
背景色：#AAA；
高度：50px；
}
#包装纸{
保证金：0自动；
高度：计算（100%-50px）；
宽度：100%；
背景色：#EEE；
显示器：flex；
}
#处理者{
背景色：红色；
宽度：5px；
光标：col resize；
}
#左{
宽度：200px；
}
#内容{
宽度：100%；
弹性：1；
}
/* ----------- */
#左{
背景颜色：黄色；
}
#内容{
背景色：#232378；
}

头
网格布局模块是纯CSS

可调整大小的窗格通常需要JavaScript才能正常工作

知道CSS主要是为样式和表示而设计的，在中很可能没有内置属性或方法可以提供手动调整大小的窗格。
好的，CSS中有
resize
属性。但我还没有找到一种方法使它能够很好地与CSS网格配合使用。