Javascript 标题过长将菜单按钮滑到卡的右侧外侧

我对MuiCardHeader有问题

<CardHeader
    disableTypography
    avatar={renderAvatar()}
    action={
        <IconButton onClick={toggleMenu}>
            <img src={MoreIcon} alt=""/>
        </IconButton>
    }
    title={
        <Typography noWrap variant="subtitle1">
            {data.name}
        </Typography>
    }
    subheader={
        <Typography variant="subtitle2" color="textSecondary">
            {data.children.items.length} items
        </Typography>
    }
/>

到

.MuiCardHeader内容

类

---

谢谢大家的帮助

您需要使用

文本溢出：省略号

，

溢出：隐藏

和

空白：nowrap

---

因此，在您的情况下，您只需将

.MuiTypography noWrap

添加到父级

.MuiCardHeader内容
寻求代码帮助的问题必须包含在问题本身中重现所需的最短代码，最好是在一个文本中。如果您想隐藏文本并在title html属性中显示整个标题，我建议您检查溢出。或者你可以用break这个词来打破它css@Paulie_D@MaximeGUILHEM我试过了。不起作用感谢提供的代码，只需添加
max width:70%在类中：
MuiCardHeader内容
textOverflow: "ellipsis",
overflow: "hidden",
whiteSpace: "nowrap",