html - 图像未对齐

问题描述

我有一个问题，每当我尝试排列我的图像时。好像没有排队。我不知道这是否是图像问题，但我可以使用一些帮助。我对此很陌生，所以如果我觉得这是一个简单的解决方法，我深表歉意。

.portfolio-item-wrapper2 {
    display: flex;
    grid-template-columns: 1fr 1fr 1fr;

}

.portfolio-item-wrapper2 {
    position: relative;

}

.portfolio-img-background2 {
    height: 350px;
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.img-text-wrapper2 {
    position: absolute;
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    text-align: center;
    padding-left: 100px;
    padding-right: 100px;
}

<div class="content=wrapper2">
    <div class="portfolio-items-wrapper2">
        <div class="portfolio-item-wrapper2">
            <div class="portfolio-img-background2">
                <div class="img-text-wrapper2">
                    <div class="logo-wrapper2">
                        <img src="\\kcfs04\StudentHome\20023600\Downloads\C.png" />

                    </div>
                </div>

            </div>
        </div>
    </div>

</div>

<div class="content=wrapper3">
    <div class="portfolio-items-wrapper3">
        <div class="portfolio-item-wrapper3">
            <div class="portfolio-img-background3">
                <div class="img-text-wrapper3">
                    <div class="logo-wrapper3">
                        <img src="\\kcfs04\StudentHome\20023600\Downloads\G.png" />

                    </div>
                </div>

            </div>
        </div>
    </div>

</div>

这是问题：

我需要它们并排放置，因为我将在下面添加更多内容，但位置相同。

标签： htmlcssimagevisual-studio-code

html - 图像未对齐

问题描述

解决方案

推荐阅读