Flex布局中元素主轴上平均分布 多余的向左对齐

content:父元素

content-item: 子元素

主轴上子元素平均分布
css 复制代码
.content {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	.service-item {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		width: 80px;
		height: 80px;
	  }
}

效果:

给父元素添加伪元素
css 复制代码
.content:after {
	content: "";
	flex: auto;
}
.content {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	.service-item {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		width: 80px;
		height: 80px;
	}
}

效果:

相关推荐
东东2336 分钟前
GeoJSON 介绍:Web 地图数据的通用语言
前端·javascript·json
之恒君6 分钟前
Promise.resolve(x) 等同 new Promise(resolve => resolve(x))?
前端·promise
亮子AI7 分钟前
【Javascript】jsondiffpatch检测到子节点改变了,父节点会标记为改变吗?
开发语言·前端·javascript
什么时候星期五10 分钟前
antd 4.x Tabs 点击阻止冒泡
css·react.js
T___T25 分钟前
写着写着,就踩进了 JavaScript 的小坑
前端·javascript·面试
月亮慢慢圆29 分钟前
首字母模糊匹配
前端
一个有理想的摸鱼选手30 分钟前
CesiumLite-在三维地图中绘制3D图形变得游刃有余
前端·gis·cesium
一千柯橘30 分钟前
Three.js 坐标系完全入门:从“你在哪”到“你爸在哪”都讲清楚了
前端
独角仙梦境31 分钟前
同事:架构太复杂了,源码文件找半天。 我:源码溯源了解一下?
前端·vue.js
八哥程序员32 分钟前
从border-image 到 mask + filer 实现圆角渐变边框
前端·css