html – 如何防止填充的子元素溢出其父元素？

发布时间：2020-12-14 23:47:46 所属栏目：资源来源：网络整理

导读：从 this example可以看出,输入似乎“溢出”了它的父div.我想在输入中添加填充而不使其溢出其父级. 我想知道每个浏览器(包括IE,Firefox,Chrome等)的最佳解决方案/解决方法. 解决方法你可以看到 this answer,但如果你不喜欢它,你可以使用像这样的box-sizing C

从 this example可以看出,输入似乎“溢出”了它的父div.我想在输入中添加填充而不使其溢出其父级.

我想知道每个浏览器(包括IE,Firefox,Chrome等)的最佳解决方案/解决方法.

解决方法

你可以看到 this answer,但如果你不喜欢它,你可以使用像这样的box-sizing CSS3属性：

input {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

Live jsFiddle example

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!