当高度随着文本增加而增加时，网格列内部输入将推高div

Question

了解我正在发生的事情的最好方法就是观看视频：

video of content inside input pushes up div of messages - NOT WORKING

了解我希望它如何工作的最好方法是从discord.com聊天社区获取的这段视频

The way it should work

我正在使用TailWindCSS，在最简单的示例中，我有一个3列的网格，但是如果单击并查看两个视频，您将了解正在发生的事情以及我想要的事情。

<div class="grid grid-cols-3 gap-2 mx-2">
 <div>
   // lots of clients
 </div>
 <div>
   <div>lots of messages - this needs to scroll also</div>
   <input type="text"></input>
</div>
</div>

如果有人可以放一个Codepen，Sandbox，jsbin，那么有什么用！

Answer 1

可悲的是，一个简单的overflow-hidden导致了这个可怕的问题，老实说，由于我什至不擅长CSS，我还是通过反复试验解决了这个问题。