Html 改变<；输入类型=文本>；字体大小不改变其宽度

我有两个文本框，它们的宽度比应该是2:1，我可以使用flex来实现。但是，当我将字体大小更改为300%时，文本框的宽度将变得相等。
如何避免这种情况，并将宽度保持在2:1的比例

代码如下：

输入[类型=文本]{
字体大小：300%；
}
#b4{
弹性：2；
}
#b2{
弹性：1；
}
div{
显示器：flex；
宽度：100%；
}

---

您可以为文本框设置固定的高度和宽度，并根据自己的选择设置字体大小

例如：

width: 180px;
font-size: 24px;
height: 25px;`

---

这似乎是Firefox的问题，因为Chrome和IE11没有任何问题。（不能像在Windows上一样在Safari上测试）

一种解决方案是，将单个输入封装在div中，并调整这些输入，然后将输入设置为100%宽

在FF 40中测试，似乎有效

*{
-webkit框大小：边框框；
-moz框大小：边框框；
框大小：边框框；
}
输入[类型=文本]{
显示：块；
宽度：100%；
边框：1px纯绿色；
}
.加倍{
弹性：2；
}
.单身{
弹性：1；
}
.包裹{
显示器：flex；
边缘底部：1米；
}
.大输入[类型=文本]{
字体大小：300%；
}

---

这是Firefox的问题

最好的解决方案是为输入添加最小宽度

input{ min-width:0;}

或

---

将单个输入包装在div中，并对其进行调整，并将输入设置为100%宽。

@FalcoB:在将其转换为代码片段之前，原始代码是这样的吗？我不明白为什么这可以被看作是比我在问题中看到的更干净的代码，而你的编辑是挂起的。缩进到处都是，HTML中有多余的空行，这很难看。似乎有些不对劲。请尝试在

px

或

em

中指定

font size

，但在

%

中除外。在较大的屏幕中，字体大小为1:2。你是说小屏幕的问题吗？@amitsigh我必须在

%

中设置字体大小，并且在

px

或

em

中设置字体大小不起作用。无法复制-不。我不想设置固定尺寸。我的android上的chrome也有同样的问题。最小宽度：0修复了它。谢谢@Abhiman Ranaweera我甚至无法解释找到这个我有多高兴。我一直在寻找一份体面的工作，我自己也尝试过很多事情，但我不敢相信我没有尝试过这个。。。非常感谢。