我正在尝试使用图像网格创建一小部分页面。我想知道是否有办法使得无论屏幕大小如何,最左侧和右侧的图像都可以始终粘在容器的边缘。
我使用flexbox创建了一个网格,通过创建一个数字网格并使它们内联并制作容器,.grid,75vw。
我该怎么做?这是网站:https://1080benchmarks.github.io/projects/portfolio/pages/webdesign.html
这是代码
.contentcontainer {
width: 100vw;
display: flex;
justify-content: center;
}
.content {
width: 75vw;
}
p {
font-family: 'Libre Baskerville', serif;
font-size: 1.5rem;
padding-top: .5rem;
}
.grid {
width: 75vw;
display: flex;
justify-content: center;
flex-flow: wrap;
margin-top: 5rem;
}
.gridimage {
height: 220px;
width: auto;
border-radius: 1em;
margin-left: 1rem;
margin-right: 1rem;
margin-top: 1rem;
margin-bottom: 1rem;
box-shadow: 1px 0px 3px rgba(0,0,0,0.25);
transition: all .5s ease-in-out;
filter: grayscale(100%);
}