解决padding撑大div盒子的问题

前言

最近在优化项目的过程中,发现使用了padding以后。

当点击操作时盒子老是会被撑大,起初以为是因为设置margin的原因 但是也设置了溢出配置 overflow: hidden; 。

后来发现原来是padding的原因,去css查了一下,原来 盒子宽度=padding+border+内容宽度。

解决办法

  1. 设置 盒子宽度=padding+border+内容宽度 可以解决盒子被撑大的问题
  2. 在使用padding的 div里 设置
    box-sizing: border-box;

原因:因为在设置了 box-sizing: border-box; 以后 相当于把padding和border的值都算在content里、

盒子模型会自动根据padding和border的值来调整content的值,就不需要手动调整

上一篇 MySQL之配置环境变量
下一篇 MYSQL之数据库连接
距离活动开始
--
:
--
:
--
:
--
00 : 00 : 00
2026429星期三

今日时光

00 : 00 :00
已过 0 剩余 0
0%
目录
涛哥

涛哥管理员

一名95后Java全栈开发程序员,95后技术分享博主,致力于技术分享和个人项目创作

本月创作热力图