Html 断线后跨距眼全切面

晚上好！我正试图将两条线的跨度居中。如果屏幕的宽度足够大，跨度可以将所有内容保持在同一行上，则可以将其居中，跨度背景将包裹文本。如果我选择一个小的宽度，它将分成两行，并具有跨度背景全宽。我想保持蓝色背景覆盖文本范围。这是什么行为？如果我没有将文本对齐：居中；两条线上的跨度甚至不会居中，因此不考虑弯曲

html:

正文{
保证金：0；
填充：0；
}
.文本容器{
背景色：红色；
显示器：flex；
证明内容：中心；
对齐项目：居中；
柔性包装：包装；
}
.文本{
背景颜色：蓝色；
文本对齐：居中；
}

职业机会

不确定你想说什么。你想得到什么结果？当设备的宽度很小，跨距中的文本分成两行时，跨距的宽度和高度将是父级的100%，我不想这样，如果你添加

空白：nowrap

到

.text

，你能得到你想要的吗？不幸的是，不能。它只是阻止文本分成两行