如何移除自动边距？设置margin:0无效寻求解决方案

别只死磕单个元素的margin:0，试试这些实用方向：

• 重置浏览器默认样式：多数浏览器会给<html>、<body>加默认margin/padding，全局清掉最省心

  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  

  嫌全局重置太狠，就单独处理根标签：

  html, body {
    margin: 0;
    padding: 0;
  }
  

• 用开发者工具找根源：按F12打开元素审查，鼠标hover页面空白区域，看高亮的是哪个元素的margin/padding，说不定边距根本不是你想改的那个元素的

• 检查margin折叠：相邻块级元素的margin会叠加，父元素和子元素的margin也会合并，给父元素加overflow: hidden或者padding: 1px就能打断折叠

• 排查伪元素：有些框架或自定义样式会给元素加::before/::after伪元素，不小心生成了空白，在开发者工具里查看元素的伪元素列表，确认有没有额外内容或边距

• 检查样式优先级：如果你的margin:0被其他样式覆盖，去「计算样式」面板看最终生效的margin值，找到对应的样式规则，要么提高自己样式的优先级，要么针对性覆盖

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