添加省略号后如何对齐文本

Question

我有一个宽度为150px的容器；在这里，我要显示“用户名”，“位置”，“手机号码”，“电子邮件”，每个都显示在单独的行中。我将省略号用于较长的文本。添加以下省略号后的问题

1. 对于数字，省略号和最后一个字符之间有一个空格
2. 添加椭圆后，容器内的内容未居中对齐。

Here is the CodePen link for recreating this issue.

.target {
    width: 150px;
    background-color:#dc143c;
    color: #fff;
}

.target-title div {
    overflow: hidden;
    padding-top: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

请帮助！