我正在投资组合页面,我想我会添加一些证书.我已经制作了一个网格,并使用了网格中{grid-row-gap: 50px;}的其他块.但其中一个并没有落实到位.
最后一个块(.cert5)的上边距比其他块大.
我将把代码放在下面,这样你就可以看到我到目前为止所做的事情:(SideNote - 我是编码的新手,所以我可能写的不太优雅.)
这是CSS和HTML:
.certcontainer {
background-color: hsl(120, 30%, 40%);
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: repeat(3, 1fr);
grid-row-gap: 50px;
justify-items: center;
width: auto;
height: auto;
margin-top: 0;
margin-left: -10px;
margin-right: -8px;
}
.cert1 {
border: 30px solid transparent;
border-image: url(http://pngimage.net/wp-content/uploads/2018/06/marcos-para-fotos-dorado-png-5.png) 100 repeat;
width: 400px;
height: 247px;
margin-top: 80px;
}
.cert2 {
border: 30px solid transparent;
border-image: url(http://pngimage.net/wp-content/uploads/2018/06/marcos-para-fotos-dorado-png-5.png) 100 repeat;
width: 400px;
height: 247px;
margin-top: 80px;
}
.cert3 {
border: 30px solid transparent;
border-image: url(http://pngimage.net/wp-content/uploads/2018/06/marcos-para-fotos-dorado-png-5.png) …