Html 防止字段集调整内容大小

我试图调整我的

元素的大小，但它自动使其内容变小。然后，我在CSS文件中添加了

display:inline block

（正如许多关于类似主题的答案所建议的那样）。然而，这一点都没有帮助，一切都是一样的。我该怎么办？我想要一个noob友好的解决方案，因为我不太擅长CSS，你可能已经注意到了。干杯

字段集{
显示：内联块；
边框：1px纯蓝色；
背景色：白色；
宽度：40%；
}
传奇{
显示：内联块；
填充：4px8px；
边框：1px纯蓝色；
字体大小：15px；
颜色：白色；
背景颜色：蓝色；
文本对齐：左对齐；
}
标签{
宽度：100px；
右边距：30px；
显示：内联块；
文本对齐：左对齐；
}
输入[类型=文本]{
宽度：25%；
填充：10px 20px；
边际：0px0；
显示：内联块；
边框：1px实心#ccc；
边界半径：4px；
框大小：边框框；
}

XXX
用户名：

如果在内容宽度上使用百分比，它将根据容器的宽度（字段集）而改变

只需删除百分比值

字段集{
显示：内联块；
边框：1px纯蓝色；
背景色：白色；
}
传奇{
显示：内联块；
填充：4px8px；
边框：1px纯蓝色；
字体大小：15px；
颜色：白色；
背景颜色：蓝色；
文本对齐：左对齐；
}
标签{
宽度：100px；
显示：内联块；
文本对齐：左对齐；
}
输入[类型=文本]{
填充：10px 20px；
边际：0px0；
显示：内联块；
边框：1px实心#ccc；
边界半径：4px；
框大小：边框框；
}

XXX
用户名：