OGeek|极客世界-中国程序员成长平台

标题: iphone - 提交按钮的长度与 iPhone 模拟器中的输入字段的长度不同 [打印本页]

---

作者: 菜鸟教程小白    时间: 2022-12-13 15:28
标题: iphone - 提交按钮的长度与 iPhone 模拟器中的输入字段的长度不同

我希望我的文本字段和按钮跨越整个屏幕大小，但文本字段和按钮的长度不同，即使它们使用相同的 CSS 选择器。

这是代码:http://jsfiddle.net/AakN4/2/

在 Safari 中差异不大，但仍然可见。

结果

具有定义的像素宽度的左侧
宽度为 100% 的 Rigth(文本字段的长度应与按钮的长度相同)。

http://i.minus.com/jUbh0W0aVWFMl.png

---

Best Answer-推荐答案

为您的输入定义 box-sizing。像这样写:

input {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 15pt;
    width: 150px;
}

查看 http://jsfiddle.net/AakN4/4/

差异的原因是 input type="submit" 默认像 box-sizing 一样工作。它完全包含 padding & border 和 width & input type="text" 添加 padding & border 与它的完全宽度。

关于iphone - 提交按钮的长度与 iPhone 模拟器中的输入字段的长度不同，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11756345/

---

欢迎光临 OGeek|极客世界-中国程序员成长平台 (https://ogeek.cn/)

Powered by Discuz! X3.4