Ant-Design Description 中由于内容过长,导致文字换行,有什么办法可以有效解决这个问题?

<a-descriptions
              title="基础信息"
              bordered
              size="middle"
              :column="{ xxl: 4, xl: 3, lg: 3, md: 3, sm: 2, xs: 1 }"
            >
              <a-descriptions-item label="名称" style="word-break: keep-all">
                {{ item.properties.name }}
              </a-descriptions-item>
              <a-descriptions-item label="门牌" style="word-break: keep-all">
                {{ getMenpai(item.properties.descs) }}
              </a-descriptions-item>
              <a-descriptions-item label="街道" style="word-break: keep-all">
                {{ getJiedao(item.properties.descs) }}
              </a-descriptions-item>
              <a-descriptions-item label="楼层" style="word-break: keep-all">
                {{ item.properties.floor }}
              </a-descriptions-item>
              <a-descriptions-item label="地址" style="word-break: keep-all">
                {{ item.properties.descs }}
              </a-descriptions-item>
            </a-descriptions>

由于内容过长,导致前面的“名称”等字段出现换行,有什么办法可以解决这个问题

img

a-descriptions-item 只是个组件名称,需要找到dom里面真实的class类名,使用样式穿透设置word-break

f12 查看dom的真实class 再写到scss里面

img


浏览器里面的class