无法垂直居中div？尝试absolute定位与flexbox均无效求助

你的Flex布局代码逻辑是对的，垂直居中没生效的核心原因是父元素没有设置足够的高度——justify-content: center是在父元素的高度范围内分配空间，没有高度的话自然看不到垂直居中效果。

修复步骤： #

1. 给.all-questions设置明确高度，比如让它占满整个视口高度：

.all-questions {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* 添加高度设置 */
    height: 100vh;
    /* 可选：去掉默认边距避免滚动条 */
    margin: 0;
}

2. 如果.all-questions是嵌套在其他容器里，还要确保它的父容器（比如body和html）也有足够高度：

html, body {
    height: 100%;
    margin: 0;
}

3. 排查子元素冲突样式：如果子元素设置了position: absolute、float这类脱离文档流的属性，会导致Flex居中失效，检查并移除这类冲突规则。

验证方式 #

修改后，.all-questions内的子元素会同时实现水平和垂直居中。如果仍未生效，用浏览器开发者工具查看元素的计算样式，确认Flex相关属性是否被其他CSS规则覆盖。

内容的提问来源于stack exchange，提问作者ameymeow