对齐 mat-icon 和 img
杰斯珀
我想将我的垫子图标的底部与其旁边的 img 的底部对齐。我尝试了多种方法，这就是它目前的样子：
这是我的 HTML：
<div class="container">
<p class="triage"><mat-icon>assignment_ind</mat-icon></p>
<p class="O2"><img src="../../assets/med_O2.png"></p>
</div>
CSS：
.O2, .triage{
display: inline-block;
vertical-align: middle;
}
.container img {
width: 50px;
height: 50px;
}
.container mat-icon{
font-size: 60px;
width: 60px;
}
科林·盖尔
使用行高：
.container
{
line-height: 60px; //or what ever height your container is
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
将img和ul列表对齐
- 2
在jsp中对齐img和输入
- 3
垂直对齐 Icon 和 TextInput
- 4
在一行中对齐hr标签和img标签
- 5
对齐img（float：left）和导航（nav（right：float））的底部
- 6
CSS：在img和列表上垂直对齐
- 7
img div 和 txt(h3) 对齐
- 8
使 img 和 input 正确对齐并在 html 中向右浮动
- 9
水平div img对齐
- 10
使标题与img对齐
- 11
OpenCV中的Mat矩阵和SSE的16字节对齐
- 12
OpenCV中的Mat矩阵和SSE的16字节对齐
- 13
如何在同一行上对齐span和img元素？
- 14
在同一行中<img>和居中对齐的<span>不起作用
- 15
垂直对齐中间不适用于h2和img标签
- 16
如何在导航栏中对齐 h4 和 img 元素？
- 17
asp：文字与img不对齐
- 18
将多个<img>与float对齐
- 19
是否可以在相对父<div>中将<img>对齐到底部，而父div的宽度和高度以％为单位？
- 20
在div中垂直对齐img？
- 21
如何将<a> <img> </a>标签与div对齐
- 22
将<img>标签与表格中的文本对齐
- 23
对齐img元素内的文本div
- 24
在div中垂直对齐img？
- 25
填充和对齐-误解
- 26
位域和对齐
- 27
对齐文字和照片
- 28
字体和对齐问题
- 29
位域和对齐
我来说两句