style(richedit): 修复标签布局换行问题并优化显示

调整标签容器的 flex-wrap 属性以支持多行显示
为标签项添加 nowrap 属性防止内容换行
This commit is contained in:
zzp 2025-11-13 21:58:15 +08:00
parent 48e131a5fa
commit 4dc81fdac3
2 changed files with 13 additions and 1 deletions

View File

@ -1091,6 +1091,7 @@ onMounted(async () => {
.labels { .labels {
display: flex; display: flex;
gap: 5px; gap: 5px;
flex-wrap: wrap;
.label_item { .label_item {
height: 24px; height: 24px;
@ -1111,6 +1112,14 @@ onMounted(async () => {
text-align: center; text-align: center;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
flex-wrap: nowrap;
white-space: nowrap;
}
.label_item_box {
// width: 100%;
display: flex;
gap: 5px;
} }
} }
</style> </style>

View File

@ -1330,7 +1330,7 @@ onMounted(async () => {
.labels { .labels {
display: flex; display: flex;
gap: 5px; gap: 5px;
flex-wrap: wrap;
.label_item { .label_item {
height: 24px; height: 24px;
background: #f6f6f6; background: #f6f6f6;
@ -1350,6 +1350,9 @@ onMounted(async () => {
text-align: center; text-align: center;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
flex-wrap: nowrap;
white-space: nowrap;
} }
} }