Hack Forums
Removing asterisk (*) from forms - Printable Version

+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Webmasters (https://hackforums.net/forumdisplay.php?fid=141)
+---- Forum: Website Construction (https://hackforums.net/forumdisplay.php?fid=50)
+---- Thread: Removing asterisk (*) from forms (/showthread.php?tid=5656933)

Removing asterisk (*) from forms - GreenTea - Jun 27, 2017

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 - Jun 27, 2017

Add in the CSS
Code
.required{
display: none;
}


* - GreenTea - Jun 27, 2017

(Jun 27, 2017 12:38 PM)Rushax Wrote:  Add in the CSS
Code
.required{
display: none;
}

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

(Jun 27, 2017 12:41 PM)Orka Wrote:  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 - Jun 27, 2017

(Jun 27, 2017 12:55 PM)Orka Wrote:  Try narrowing the selector:
Code
label.title > span.required {
    display: none;
}

Yup, Orka's nailed it.

* - GreenTea - Jun 27, 2017

(Jun 27, 2017 12:55 PM)Orka Wrote:  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 - Jun 27, 2017

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"