关于雪碧图在一行不能垂直居中的问题

来源:6-6 作业题

qq_陌_45

2018-02-09 23:21:04

<!--轮播图右侧-->
			<div class="banner-right">
				<div class="banner-form">
					<div class="form-1"><i></i>快速预约</div>
				</div>
			</div>
/*轮播图右侧*/
.banner-form{
	width: 250px;
	height: 52px;
	line-height: 52px;
	background-color: red;
	position: relative;
	text-align: center;
}

.form-1 i{
	background-image: url(../img/icon-help.png);
	background-repeat: no-repeat;
	width: 22px;
	height: 23px;
	display: inline-block;
	background-position: 0 0;
}

.form-1{
	color: #fec009;
}

最近一直遇到这个问题,就是一行设置了高和行高,应该所有元素都垂直居中,可是图片不会,然后给他添加顶部外边距也没效果,怎么解决呢?

写回答

1回答

好帮手慕糖

2018-02-11

你好,给i设置margin-top来进行调整,但是由于是行内块,有对文字有一定的影响,所以建议这里可以使用块级然后浮动。

祝学习愉快~

0

0 学习 · 36712 问题

查看课程