Ionic-framework: 按钮中的长文本不会被截断

创建于 2016-10-14 · 3评论 · 资料来源: ionic-team/ionic-framework

问题的简短描述：

按钮中的长文本不会被截断。我正在使用full和block按钮

虽然按钮确实有省略号，如下所示；

.button {
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

这不起作用，因为.button-inner类有display: flex

你期待什么行为？

显示省略号。

这可以通过将.button-inner的显示设置为inline来完成。但是，我真的不知道它的显示是弯曲的原因。

哪个离子版本？ 2 RC.0

core feature request

资料来源

alan-agius4

👍2

最有用的评论

我认为flex可以帮助居中吗？不知道你们都想如何解决它，但我能够解决这样的问题的唯一方法是给它另一个内在的孩子。例如

```

I then put a class on `.overflow-me` to do the ellipsis.

.溢出我{
溢出：隐藏；
文本溢出：省略号；
}
```

ncapito 于 2016-11-28

👍3 🎉1

所有3条评论

我认为flex可以帮助居中吗？不知道你们都想如何解决它，但我能够解决这样的问题的唯一方法是给它另一个内在的孩子。例如

```

I then put a class on `.overflow-me` to do the ellipsis.

.溢出我{
溢出：隐藏；
文本溢出：省略号；
}
```

ncapito 于 2016-11-28

👍3 🎉1

这实际上非常复杂，因为按钮用于许多组件中。将内部 div 添加到按钮会导致其他地方出现问题，并且将显示从 flex 更改为 inline 会导致包含图标和锚链接的按钮出现问题，这些按钮的样式看起来像按钮。由于@ncapito上面的代码有效，我现在将把它从里程碑中删除，但我会重新讨论这个问题。

brandyscarney 于 2016-12-05

谢谢你的问题！由于不活动，此问题正在关闭。如果这仍然是最新版本的 Ionic 的问题，请创建一个新问题并确保完整填写模板。

感谢您使用离子！

ionitron-bot[bot] 于 2018-03-26

此页面是否有帮助？

0 / 5 - 0 等级

Ionic-framework: 按钮中的长文本不会被截断

问题的简短描述：

你期待什么行为？

最有用的评论

所有3条评论

相关问题