FORM_REQUIRED_INPUT - Moving Asterisk

[Dnj1964]

asterisk.png

Trying to move the asterisk with CSS tried many variations of code

Code: Select all

.form-control-feedback {right: 30px;!Important}

Any help greatly appreciated.

[zipurman]

You could do:

Code: Select all

input + span .fa-asterisk::before {
    position: relative !important;
    right: -20px;
}
select + span .fa-asterisk::before {
    position: relative !important;
    right: -10px;
}

[plamastus]

Where exactly do I add that code?

I added it to the gustavo.css, but made no diference.

Thanks

[zipurman]

Into your user.css file. Not sure where in the stack your gustavo.css is being loaded. The style needs to be loaded after fontawesome. You could also try:

Code: Select all

input + span .fa-asterisk::before {
    position: relative !important;
    right: -20px !important;
}
select + span .fa-asterisk::before {
    position: relative !important;
    right: -10px !important;
}

[plamastus]

Hi,

Thanks...

It does work, but it seems to me that it's on the way when attributes are long...

Thanks,

[zipurman]

The asterisk is being placed at the end of the field using font awesome and css. It cannot detect the length of the content. You could either remove it, or you could change the logic for it to append after the field. Anything is possible ... just depends on what is needed.

[heatherbell]

it seems to me that it's on the way when attributes are long...

Yes, if 'Add Helper Text' and 'Enforce Selection' are set to 'True' in module, I don't think the asterisk is helpful to anyone so in that case we remove it.
E.g in cm_pi_options_attributes.php, change line 31 to

Code: Select all

$fr_input    = '';

[zipurman]

Or you could add the following css to your user.css

Code: Select all

input + span .fa-asterisk::before {
    content: '' !important;
}
select + span .fa-asterisk::before {
    content: '' !important;
}