如下所示,我有三个方框.您可以看到在方框1和3中一切正常,但是在方框2中,文本内容重叠.
这是因为< div>类别为.vertical_center.grade_info的对象,其margin-left选项仅适用于100px.我不要这些路口.
如何单独更改所有包装盒的左边距以避免出现此问题?
到目前为止,这是我的代码:
.three_separation {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 60px;
}
.grades_dashboard_Box {
height: 130px;
width: 320px;
background-color: #0d0d0d;
color: #ffffff;
margin: 0 auto;
position: relative;
}
.grade_display {
float: left;
font-size: 60px;
}
.vertical_center {
margin: 0;
position: absolute;
top: 50%;
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
2.3
Beste Durchschnittsnote
Biologie
13.70
Durchschnittsnote
3.4
Schlechteste Durchschnittsnote
Deutsch