Так что с materializecss я пока не выяснил, как сделать квадратную сетку изображений, вместо этого я использовал col s (n), чтобы сделать их вместо этого.Так как все эти изображения не равны по размеру, я должен создать стиль для их одинаковой сетки, задав его «подгонка объекта» для «cover», чтобы заполнить высоту столбца, и установить для overflow значение «hidden».
В этом проблема, если я установлю «materialboxed» на тег img, у изображений (внутри столбцов (n)) будет удалено свойство «подгонка объекта», в основном изображения вернутся к исходному соотношению сторон,но все еще внутри col s (n).Но если я установлю тег "materialboxed" на тег div class = "col s (n) ...", увеличенные изображения будут обрезаны так же, как в сетке.
Любая помощь будет оченьприветствуется.
Спасибо.
HTML:
<div class="col s4 m4 l2 gridgallery" style="padding: 0px;">
<img class="materialboxed" src="data/images/EXTERIOR_001.jpg">
CSS
.gridgallery {
width: inherit;
height: 180px;
}
.gridgallery img{
object-fit: cover;
height: 100%;
width: auto;
overflow: hidden;
}