我有以下简单的布局(除了 textarea 在运行时变成 Code Mirror):<div class="columns"> <div class="column is-paddingless" style="background: indigo;"> <textarea id="code-editor"></textarea> </div> <div class="column"> </div> </div> 问题在于,第一列不能填充页面的垂直空间(选项卡下方),而只是包裹了textarea的高度。例如: 有没有办法使列填满页面?
弹性盒子布局对您应该很有用!供您参考,我喜欢这篇指南:https://css-tricks.com/snippets/css/a-guide-to-flexbox/ 像这样设置您的.columns应该可以解决问题:.columns { display: flex; flex-direction: row; // this is default align-items: stretch; // this will stretch the children vertically } 不确定您如何样式化.column(例如高度:100%),但如果此方法不起作用,让我知道,我可以进一步进行故障排除。