css - 省略未添加到材质 UI 选项卡文本中
问题描述
我是网络开发的新手。在这里,我正在尝试为标签中的标签标签的 span 元素添加省略号。
<div class="MuiTabs-scroller MuiTabs-fixed" role="tablist" style="overflow: hidden;">
<div class="MuiTabs-flexContainer">
<button class="MuiButtonBase-root MuiTab-root VIP_tabRoot MuiTab-textColorInherit Mui-selected VIP_tabSelected" tabindex="0" type="button" role="tab" aria-selected="true">
<span class="MuiTab-wrapper VIP_tabIconWrapper">Test004</span>
</button>
</div>
</div>
现在,我在这里尝试为这个跨度文本添加文本溢出。我已经应用了以下解决方案,
.VIP_tabIconWrapper {
max-width : 100px;
text-overflow: elipses;
word-wrap: no-wrap;
white-space: nowrap;
}
但我仍然无法添加。谁能帮我这个?
解决方案
这是如何实现的:
.VIP_tabIconWrapper {
overflow: hidden;
white-space:nowrap;
text-overflow:ellipsis;
width:100px;
display:inline-block;
}
- 元素必须是
inline-block
- 您必须提供
width
财产 - 你在省略号上有一个错字:)
推荐阅读
- spring - CrudRepository Spring Data @Query 语法
- django - 自定义 wagtail 页面模型保存方法调用了两次
- javascript - 显示从 ajax 操作页面到与 ajax 输出表分开的 ajax 调用页面的总量
- python - 从python中的文本文件中读取特定值
- django - 如果为空,则重做查询集并将信息传递给模板
- java - 返回图像 AWS S3 (S3Object) Spring REST 控制器
- java - 如何在 JavaFX 中合并 TableView 单元格
- mysql - 在nodeJS中处理从数据库返回的大数字的最佳方法是什么?
- r - R中缺少列标题
- python - 如何将一系列数字插入sqlite3