ElemeFE / ElemeFE/element

[Bug Report] El-collapse-item ellipsis overflow causes misaligned expand arrow

Open
#20,989 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
Vue
Stars
54k
Forks
14.4k
PR merge metrics
No merged PRs in 30d

Description

### Element UI version
2.15.1

### OS/Browsers version
Mac Catalina / Chrome 90

### Vue version
2.6.12

### Reproduction Link
https://jsfiddle.net/hb5oaywv/

### Steps to reproduce
Create an el-collapse-item with a very long title. Set the title to truncate overflows with ellipsis.

### What is Expected?
The > expand arrows should be aligned and not be rendered outside of the element width regardless of whether or not the title is truncated via ellipsis.

Element-ui version 2.4.9 does not exhibit this bug: https://jsfiddle.net/hb5oaywv/1/

### What is actually happening?
The > expand arrow on the right will be shifted to the right compared to non-truncated titles and rendering itself outside of the element's width.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.