[Bug Report] <el-form-item> required indicator on wrong side for label-position top or left

[d--j]

Element UI version

2.4.1

OS/Browsers version

All

Vue version

2.5.17-beta.0

Reproduction Link

https://jsfiddle.net/bahc1Lve/ (includes a fix in the SCSS)
https://elementui.github.io/issue-generator/#/en-US Your own issue generator has label-position top

Steps to reproduce

Have a <el-form-item> inside a <el-form> with a label-position of top or left. This <el-form-item> has a label and is required.

<el-form label-position="top">
  <el-form-item label="Name" required></el-form-item>
</el-form>

What is Expected?

The required indicator (the red *) should be on the right side of the label.

What is actually happening?

The required indicator is on the left side of the label.

[ziyoung]

According to the doc, the label-position attribute decides how labels align. This does not affect how the identifier is placed.

[d--j]

Sure, label-position is for the label. But the indicator should be placed where it makes most sense – with label-position right (the default) that is on the left of the label (so that the labels for required and not required form items are visually aligned)

But when the label position is left or top the indicator needs to be on the right (for LTR-languages) so that labels of required and not-required form fields are visually aligned again.

[ziyoung]

Let users decide the position of the indicator by using CSS. This is not hard.

[frozenex]

It would be nice to have some property to customize the position of *