主页 / 问题 / 991682
Accepted
Frenc Olesov
Asked:2020-06-11 19:01:09 +0000 UTC2020-06-11 19:01:09 +0000 UTC

如何对齐项目

  • 772

更多截图将它们对齐到同一水平

我对自适应布局有一个特定的问题

/* Обертка */

.team__inner {
    margin: 0 30px 0;
    margin-top: -20px;
}

/* Айтемы */

.team__item {
    flex-basis: 20%;
    max-height: 50%;
    overflow: hidden
    display: flex;
}
html

2 个回答

  1. Best Answer

    逻辑如下：

    您与公司代表有一个区块，在这个区块中的内容可以有条件地分为：

    1. 图片
    2. 全名
    3. 职称
    4. 描述

    我建议使用单独的类（.photo、.fio、.position、.description）来描述上述每个块

    最后一块可以根据你的需要给定一个固定的高度，overlofw:hidden 属性可以用来隐藏“不合适的内容”。

    此外，在您的情况下，自适应布局意味着使用 .team__item 在“彼此下方”的移动设备上更改块的位置（在 1 列中，请注意这一点）。移动设备上的“每行”4 块不符合自适应布局的原则。

    • 1

  2. 尝试为父母

    align-items: center
    • 0

相关问题