[GreenTea]

Is there a way I can remove asterisk symbol from forms when I choose to require the form field? I am actually using squarespace and I did put up this question on their help forums too, but no one answered the question.

Not quite sure what information should I give, but this is kinda how a field looks like

Code

<div id="text-yui_3_17_2_1_1498319244411_39603" class="form-item field text required">
                <label class="title" for="text-yui_3_17_2_1_1498319244411_39603-field">Name <span class="required">*</span></label>
                
                <input class="field-element text" type="text" id="text-yui_3_17_2_1_1498319244411_39603-field" />
              </div>

[Rushax]

Add in the CSS

Code

.required{
display: none;
}

[GreenTea]

Add in the CSS

Code

.required{
display: none;
}

Apparently, that hides all the fields except the ones that are not required.

---

It is not possible to edit out the span itself with squarespace?

I wouldn't know how to do that. Not quite sure if its possible or not.

[Rushax]

Try narrowing the selector:

Code

label.title > span.required {
    display: none;
}

Yup, Orka's nailed it.

[GreenTea]

Try narrowing the selector:

Code

label.title > span.required {
    display: none;
}

Thanks that did work, except on this one.

Code

<div id="checkbox-yui_3_17_2_1_1498319244411_42463" class="form-item field checkbox required">
                <div class="title" for="checkbox-yui_3_17_2_1_1498319244411_42463-field"> <span class="required">*</span></div>

EDIT: Never mind, got that one too, this is what I used, apparently this worked only with commas and not the right arrow.

Code

div.title, label.title, span.required {
    display: none;
}

[Rushax]

It should really be:

Code

div.title span.required, label.title, span.required {
    display: none;
}

To make sure you hide just the span after the title class instead of hiding the whole div class="title"