u010089114 2022-11-03 21:59 采纳率: 83.3%
浏览 24
已结题

为什么当float的同级元素DIV使用padding-left：100px; 会使float向左移动100px？

请告诉我原因，谢谢

<b style="float:right;font-size: 0.5rem">十二月</b>
<div style="overflow-x:auto;white-space:nowrap;width:100%;border:1px solid black;margin-top:2rem;padding-left:100px;height:2.8rem;">
</div>
  • 写回答

2条回答 默认 最新

  • _yangyi 2022-11-03 22:47
    关注

    你给这两个元素放到同一个div里就不会出现了
    现在是因为给div加了padding-left后就相当于把这个div比原来撑大了100px,它的父级也是比原来大100px，而你的浮动是相对于原来的位置不变 所以感觉上是向左移动了100px
    当你给div增加 box-sizing: border-box;属性之后就不会出现这种情况了
    这里主要是盒模型差异性
    一般盒子宽度是width + padding + border
    加了上面代码就是 padding和border在width中包括了

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
  • 羲云网络 2022-11-03 22:14
    关注

    设置box-sizing 试下

    评论
查看更多回答(1条)

报告相同问题？

问题事件

  • 系统已结题 11月11日
  • 已采纳回答 11月3日
  • 修改了问题 11月3日
  • 创建了问题 11月3日

悬赏问题

  • ¥15 Latex算法流程图行号自定义
  • ¥15 关于#python#的问题：我在自己的电脑上运行起来总是报错，希望能给我一个详细的教程，(开发工具-github)
  • ¥40 基于51单片机实现球赛计分器功能
  • ¥15 cs2游戏画面卡住，应用程序sid与指挥者sid不匹配
  • ¥15 实验七：Pandas要有实验截图和代码
  • ¥15 TypeError: Make sure that the iterable only contains strings.
  • ¥35 电脑放图书馆，这是被黑了吗
  • ¥15 等高线中数据取消科学计数法
  • ¥15 Qt播放10路ffmpeg 视频流
  • ¥15 如何利用闲置机械硬盘变现