Html 为什么最小化的聊天室会飞？

为什么最小化的聊天室会飞

当您放大其中一个聊天室时，另一个聊天室将被移动到与另一个聊天室相同的高度。我想在底部保留最小化的一个：0

var ChatBoxMessage=Vue.extend({
模板：“#ChatBoxMessage”，
数据：函数（）{
返回{
id:0，
用户：{}，
信息：[]，
};
},
方法：{
},
});
var ChatBox=Vue.extend({
模板：“#聊天室”，
数据：函数（）{
返回{
id:0，
标题：“默认标题”，
对,，
可关闭：错误，
};
},
组成部分：{
聊天室信息
}
});
新Vue({
el:“#应用程序”，
数据：{
聊天室：[]，
},
方法：{
},
就绪：函数（）{
},
组成部分：{
聊天室，
}
});
。曲面顶部{
边界半径：5px 5px 0px 0px；
-moz边界半径：5px 5px 0px 0px；
-webkit边框半径：5px 5px 0px 0px；}
.ChatBoxContainer{
位置：绝对位置；
右：0；
宽度：100%；
底部：0；
溢出-x:scroll；}
.ChatBoxWidget{
浮动：对；
右边距：30px；}
.聊天室{
颜色：白色；
高度：300px；
背景#d3；
宽度：300px；}
.聊天室标题栏{
高度：30px；
背景：#78a400；}
.聊天室标题栏标题{
浮动：左；
保证金：5px；
文本对齐：居中；
宽度：76%；}
.聊天室标题栏标题-90{
宽度：86%！重要；}
.聊天室标题栏按钮{
float:right；}
.ChatBox\标题栏\按钮\按钮{
浮动：对；
宽度：30px；
填充物：5px；
文本对齐：居中；
左边框颜色：白色；
左边框样式：实心；
左边框宽度：1px；
游标：指针；}
.聊天室{
宽度：200px；}
.chatbox\u标题栏{
颜色：白色；
高度：30px；
背景：#78a400；}
.chatbox最小化图标{
浮动：左；
填充物：5px；
宽度：30px；
文本对齐：居中；
背景色：#6a9700；
边框左上半径：5px；}
.chatbox\u标题{
浮动：左；
边距：5px；}
.chatbox最小化按钮{
float:right；}
.chatbox最小化按钮{
浮动：对；
宽度：29px；
填充物：5px；
文本对齐：居中；
左边框颜色：白色；
左边框样式：实心；
左边框宽度：1px；
游标：指针；}
/*#sourceMappingURL=app.css.map*/

{{title}}
{{title}}
我只修改了
.ChatBoxContainer
css类


var ChatBoxMessage=Vue.extend({
模板：“#ChatBoxMessage”，
数据：函数（）{
返回{
id:0，
用户：{}，
信息：[]，
};
},
方法：{
},
});
var ChatBox=Vue.extend({
模板：“#聊天室”，
数据：函数（）{
返回{
id:0，
标题：“默认标题”，
对,，
可关闭：错误，
};
},
组成部分：{
聊天室信息
}
});
新Vue({
el:“#应用程序”，
数据：{
聊天室：[]，
},
方法：{
},
就绪：函数（）{
},
组成部分：{
聊天室，
}
});
。曲面顶部{
边界半径：5px 5px 0px 0px；
-moz边界半径：5px 5px 0px 0px；
-webkit边框半径：5px 5px 0px 0px；}
.ChatBoxContainer{
位置：绝对位置；
右：0；
底部：0；
溢出-x：滚动；
垂直对齐：底部对齐；
显示器：flex；
flex-flow：行nowrap；
对齐项目：柔性端；
}
.ChatBoxWidget{
浮动：对；
右边距：30px；}
.聊天室{
颜色：白色；
高度：300px；
背景#d3；
宽度：300px；}
.聊天室标题栏{
高度：30px；
背景：#78a400；}
.聊天室标题栏标题{
浮动：左；
保证金：5px；
文本对齐：居中；
宽度：76%；}
.聊天室标题栏标题-90{
宽度：86%！重要；}
.聊天室标题栏按钮{
float:right；}
.ChatBox\标题栏\按钮\按钮{
浮动：对；
宽度：30px；
填充物：5px；
文本对齐：居中；
左边框颜色：白色；
左边框样式：实心；
左边框宽度：1px；
游标：指针；}
.聊天室{
宽度：200px；}
.chatbox\u标题栏{
颜色：白色；
高度：30px；
背景：#78a400；}
.chatbox最小化图标{
浮动：左；
填充物：5px；
宽度：30px；
文本对齐：居中；
背景色：#6a9700；
边框左上半径：5px；}
.chatbox\u标题{
浮动：左；
边距：5px；}
.chatbox最小化按钮{
float:right；}
.chatbox最小化按钮{
浮动：对；
宽度：29px；
填充物：5px；
文本对齐：居中；
左边框颜色：白色；
左边框样式：实心；
左边框宽度：1px；
游标：指针；}
/*#sourceMappingURL=app.css.map*/

{{title}}
{{title}}
我只修改了
.ChatBoxContainer
css类


var ChatBoxMessage=Vue.extend({
模板：“#ChatBoxMessage”，
数据：函数（）{
返回{
id:0，
用户：{}，
信息：[]，
};
},
方法：{
},
});
var ChatBox=Vue.extend({
模板：“#聊天室”，
数据：函数（）{
返回{
id:0，
标题：“默认标题”，
对,，
可关闭：错误，
};
},
组成部分：{
聊天室信息
}
});
新Vue({
el:“#应用程序”，
数据：{
聊天室：[]，
},
M
.ChatBoxContainer {
  text-align: right;
}

.ChatBoxWidget {
  display: inline-block;
  vertical-align: bottom;
}