Css flexbox元素相距太远，字体大小不同

我需要flexbox容器中的所有元素彼此靠近。不幸的是，由于它们的字体大小不同，这很难实现。我可以用边距来修正它，但这似乎是一种很难做到的方法

#价格{
字体大小：粗体；
边界：无；
字号：1.5em；
}
#通货{
颜色：#000000；
字号：1.5em；
字体大小：粗体；
}
#价格：焦点{
大纲：无；
}
#价格信息{
显示器：flex；
调整项目：灵活启动；
}

美元
$/m2{sizePrice}

#价格{
字体大小：粗体；
边界：无；
字号：1.5em；
}
#通货{
颜色：#000000；
字号：1.5em；
字体大小：粗体；
}
#价格：焦点{
大纲：无；
}
#价格信息{
显示器：flex；
证明内容：中心；
对齐项目：基线
}

美元
$/m2{sizePrice}

试试这个。但要手动设置利润率并不容易

#价格{
字体大小：粗体；
边界：无；
字号：1.5em；
}
#通货{
颜色：#000000；
字号：1.5em；
字体大小：粗体；
保证金权利：.3rem；
}
#价格：焦点{
大纲：无；
}
#价格信息{
显示器：flex；
对齐项目：居中；
}
#尺码价格{
左边缘：-5雷姆；
}
伊滕斯先生{
显示：内联块；
宽度：适合的内容；
}

美元
$/m2{sizePrice}

试着把你的元素（你想放在同一行上）放在同一个级别，比如说div，然后把它绕在另一个div上，并在上面应用flexbox。我在所有子元素上使用margin:auto，成功地将它们放在同一行上，但它们看起来仍然相距很远。查看更新后的图片。@David您可以检查下面的答案是否真的起作用，项目仍然太远您是说水平方向吗？尤其是$/m2{sizePrice}

仍然太远，我猜这是由于

输入

标记上应用了一些自定义css。如果您确实从浏览器中检查元素，您将看到第二个

标记就在您的

输入旁边。正是输入的宽度将您的p标记推得如此之远。Flexbox已将其正确放置在其旁边，没有任何额外空间。试着给
输入
一个
宽度：200px
，你就会明白我的意思了