关于css中flex布局垂直居中失效问题的原因

项目中遇到用flex进行页面布局后,使用上下居中设置:align-item: center;
目标效果如下:
在这里插入图片描述

但是失效,不起作用,如下图所示:
在这里插入图片描述
各种排查过后发现设置了子模块 align-self 属性,这会覆盖容器上的 align-items 设置,直接导致父元素的align-item: center;失效,无法垂直居中。

注:align-self属性允许单个项目有与其他项目不一样的对齐方式,可覆盖align-items属性。默认值为auto,表示继承父元素的align-items属性,如果没有父元素,则等同于stretch。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/874592.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

mysql高阶语句:

mysql高阶语句: 高级语法的查询语句: select * from 表名 where limitsdistinct 去重查询like 模糊查询 排序语法:关键字排序 升序和降序 默认的排序方式就是升序 升序:ASC 配合order by语法 select * from 表名…

Python爬虫掌握-----4实战(爬取视频)

我们使用爬虫时难免会遇到爬取视频的情况,其实爬取图片视频,内容都是一样的。这里以b站视频为例。 一、开始 1.找到url,请求url 防盗链,需要写在UA伪装中 正常的三步: 1.url 2.requests请求 3.UA伪装 import req…

Zabbix基本介绍

文章目录 一、监控为什么需要监控需要监控什么Zabbix使用场景及系统概述zabbix介绍Zabbix功能Zabbix架构Zabbix术语 二、部署安装编译安装 一、监控 为什么需要监控 监控功能 在需要的时刻,提前预警即将出问题,避免故障发生。实时监控系统和业务,当出问题之后&am…

数据库安全:MySQL安全配置,MySQL安全基线检查加固

「作者简介」:冬奥会网络安全中国代表队,CSDN Top100,就职奇安信多年,以实战工作为基础著作 《网络安全自学教程》,适合基础薄弱的同学系统化的学习网络安全,用最短的时间掌握最核心的技术。 这一章节我们需…

配置Linux客户端免密登录服务端Linux主机的root用户

1.安装shh服务 首先安装shh服务,redhat端通过下面代码进行安装服务 sudo yum install sshd sudo yum install openssh-server 2.生成密钥(公钥+私钥) 执行ssh-keygen命令,会生成id_rsa(私钥&#xff0…

并发编程--synchronized介绍

1.初步认识synchronized 先来看下利用 synchronized 实现 同步的基 础 : Java 中的每一个 对 象都可以作 为锁 。具体表 现 为 以下 3 种形式。 : 对于普通同步方法, 锁 是当前 实 例 对 象。 对于静 态 同步方法, 锁 是当前 类…

python-首字母移位(PythonTip)

[题目描述] 编写一个程序,将句子中每个单词的首字母移位到下一个单词。定义函数shift_first_letter(),参数为sentence(字符串)。在函数内,将句子中每个单词的首字母移位到下一个单词。最后一个单词的首字母移位到句子的…

SQL 注入漏洞详解 - Union 注入

1)漏洞简介 SQL 注入简介 SQL 注入 即是指 Web 应用程序对用户输入数据的合法性没有判断或过滤不严,攻击者可以在 Web 应用程序中事先定义好的查询语句的结尾上添加额外的 SQL 语句,在管理员不知情的情况下实现非法操作,以此来实现欺骗数据库服务器执行非授权的任意查询,…

记录|C#+winform创建扁平化风格界面

本项目的C#内容是自己跟做的,自己做的内容已经打包,可以通过自己跟做写的Dashboard界面,C#下的winform模式下载获得,但是需要花费3个积分 目录 前言一、左边设置和步骤界面步骤Step1.Step2.Step3.Step4Step5 二、右边属性和步骤属…

【BUG】已解决:ModuleNotFoundError: No module named ‘requests‘

ModuleNotFoundError: No module named ‘requests‘ 目录 ModuleNotFoundError: No module named ‘requests‘ 【常见模块错误】 【解决方案】 欢迎来到英杰社区https://bbs.csdn.net/topics/617804998 欢迎来到我的主页,我是博主英杰,211科班出身&a…

Python怎样读取URL生成PDF

1. 安装依赖的exe 需要在这个网址,安装一个exe包,地址:https://wkhtmltopdf.org/ 进入网址后,点这个位置: 选择一个你的操作系统的下载链接: 安装后的exe文件: C:\Program Files\wkhtmltopdf…

记录解决springboot项目上传图片到本地,在html里不能回显的问题

项目场景: 项目场景:在我的博客系统里:有个相册模块:需要把图片上传到项目里,在html页面上显示 解决方案 1.建一个文件夹 例如在windows系统下。可以在项目根目录下建个photos文件夹,把上传的图片文件…

华为OD2024D卷机试题汇总,含D量50%+,按算法分类刷题,事半功倍

目录 专栏导读华为OD机试算法题太多了,知识点繁杂,如何刷题更有效率呢? 一、逻辑分析二、数据结构1、线性表① 数组② 双指针 2、map与list3、队列4、链表5、栈6、滑动窗口7、二叉树8、并查集9、矩阵 三、算法1、基础算法① 贪心思维② 二分查…

SAP 贷项销售订单简介

SAP 贷项销售订单简介 1. 什么是销售贷方销售订单?2. 创建销售贷方销售订单的场景3. 销售贷方销售订单的创建流程直接创建发票---VF01将会计凭证过账到会计核算查看贷项销售订单凭证流查看客户明细---FBL5N贷项后台配置SAP销售贷方销售订单(Sales Credit Memo Request)是销售…

Windows定时任务实现关闭和开启声音

目录 1. 下载并放置 nircmd.exe1.1 下载 NirCmd:1.2 放置 nircmd.exe: 2. 定时关闭声音2.1 打开任务计划程序:2.2 创建基本任务:2.3 设置任务名称和描述:2.4 触发器:2.5 操作:2.6 设置程序或脚本…

面试官问:Django、Flask、FastAPI,你选哪个?为什么?

如果你是python Web方向的开发工程师,那么在面试中,会经常遇到面试官问这个问题: “在Python的三个流行Web框架:Django、Flask和FastAPI,说说它们的异同,以及你是怎么选择合适的框架?” 异同对…

AndroidStudio 编辑xml布局文件卡死问题解决

之前项目编写的都是正常,升级AndroidStudio后编辑布局文件就卡死,还以为是AndroidStudio文件。 其实不然,我给整个项目增加了版权声明。所以全部跟新后,布局文件也增加了版权声明。估计AndroidStudio在 解析布局文件时候因为有版…

【目标检测】Anaconda+PyTorch(GPU)+PyCharm(Yolo5)配置

前言 本文主要介绍在windows系统上的Anaconda、PyTorch、PyCharm、Yolov5关键步骤安装,为使用yolo所需的环境配置完善。同时也算是记录下我的配置流程,为以后用到的时候能笔记查阅。 Anaconda 软件安装 Anaconda官网:https://www.anaconda…

ubuntu源码安装Odoo

序言:时间是我们最宝贵的财富,珍惜手上的每个时分 Odoo具有非常多的安装方式,除了我最爱用的 apt-get install,我们还可以使用git拉取Odoo源码进行安装。 本次示例于ubuntu20.04 Desktop上进行操作,理论上在ubuntu14.04之后都可以用此操作。 …

OpenWrt 配置 Tailscale 内网穿透

前言 Openwrt 安装 zerotier 内网穿透. Tailscale 在 OpenWrt 下配置教程参考 GXNAS 博客 的 OpenWrt安装Tailscale设置内网穿透科学出国外网互访局域网设备。啥都不会难搞 的 【傻呱呱】OpenWrt安装Tailscale。阿髙 的 openwrt设置开机自启 tailscale为例。 Tailscale 安…