Html 为什么我的专栏看起来彼此如此分离？

我正在为我的页面做一个页脚。出于某种原因，这些列看起来彼此太分离了。有什么办法可以修吗

我正在将vue与引导vue一起使用

我尝试使用偏移量，但这只会将列向右移动。如果我最后不得不移动这些列，我会将它们移到左侧，这样它们就可以彼此看得更近

模板

window.onload=（）=>{
新Vue({
el:“#应用程序”
})
}

.footer{
背景色：#ffffff；
填充：60px 0
}
.页脚联系ul，
.footer社交链接{
左侧填充：0
}
.页脚标题h4{
字体大小：16px；
字号：500；
文本转换：大写；
颜色：#000000
}
@媒体屏幕和屏幕（最大宽度：991px）{
.页脚标题h4{
利润上限：30像素
}
}
.footer联系ul li{
显示：块；
字体大小：13px；
字号：500；
颜色：#000000；
顶部填充：20px
}
.页脚联系ul li i{
颜色：#859da9；
字号：18px；
右边距：15px
}
.页脚联系ul li a{
颜色：#000000
}
.footer社交链接ul li{
显示：内联块
}
.footer社交链接ul li a{
字体大小：15px；
颜色：#000000；
填充：15px
}
.footer社交链接ul li a:悬停{
颜色：#859da9
}
.页脚菜单{
左侧填充：20px
}
.footer菜单ul li{
列表样式类型：无；
填充：5px0
}
.页脚菜单ul li a{
字体大小：14px；
字号：500；
颜色：#000000
}
.页脚菜单ul li:之前{
内容：“\f105”；
字体系列：Fontsome；
字号：18px；
右边距：10px；
颜色：#859da9
}
.列表组页脚.列表组项{
背景色：透明；
边框顶色：透明；
边框底部：透明；
左边框颜色：透明；
右边框颜色：透明；
字体大小：78%；
}
.h4矿{
字号：80%；
}
.h5地雷{
字号：80%；
颜色：黑色；
}

0800
标题
常见问题解答
标题2
112232342131
21312312
服务
一个
两个
三个
新闻
newone
newtwo

您对

元素使用的库是什么？我使用的是bootstrap vuefigured，但必须仔细检查。当我使用firefox的响应式设计模式并改变屏幕宽度时，我会遇到同样的问题。网格系统只负责为你将每一行一分为二。至于每一列的内容，你需要控制自己。