Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
Guest

How can I change the font size on a form field?

Question

Guest

Bradford template - place to fill in the forms as a small font - I cannot change the font size

Edited by Guest
Initial Revision

Share this post


Link to post

4 answers to this question

Recommended Posts

  • 2

@rcsfonseca You can change the font sizes on forms using Custom CSS. You can decide on the font size of names, descriptions and field contents by changing the values below:


/***************************************
Styling changes to Form
***************************************/
.form-wrapper .field-list {
 .title {
   /* Title of field (eg Name, Subject, Message) */
   font-size: 18pt;
 }
 .description {
   /* Description */
   font-size: 26pt;
 }
 .field {
   .caption {
     /* Captions of fields (eg First Name, Last Name) */
     font-size: 16pt;
     .field-element {
       /* Text in the field boxes (First Name, Last Name) */
       font-size: 28pt;
     }
   }
   .field-element {
     /* Text in the field boxes (inc placeholder text) */
     font-size: 20pt;
     /* Shading colour of all boxes */
     background: #F9FFE5;
   }
 }  
}



World-class Squarespace Developer and Squarespace Circle Leader with a strong reputation on the Squarespace Forum.
I'm trusted by hundreds of Squarespace users worldwide, including designers, freelancers, business owners and big agencies.

I can tackle anything from small tweaks to full websites and I'm available for short and long bookings (min. 1 hour).
Book via my website giving as much notice as possible. Note that I'm usually booked 4 - 6 weeks in advance for jobs longer than 2 hours.
Prebuilt Squarespace Extensions
Custom Squarespace Extensions: Tell me about the functionality you need

**NEW** Our popular Date Picker Extension and Age Verification Extension are now Squarespace 7.1 compatible.

Share this post


Link to post
  • 1

Checkboxes are field options. You can change them with something like this:


.form-wrapper .field-list .field .option {
   font-size: 16px;
}



World-class Squarespace Developer and Squarespace Circle Leader with a strong reputation on the Squarespace Forum.
I'm trusted by hundreds of Squarespace users worldwide, including designers, freelancers, business owners and big agencies.

I can tackle anything from small tweaks to full websites and I'm available for short and long bookings (min. 1 hour).
Book via my website giving as much notice as possible. Note that I'm usually booked 4 - 6 weeks in advance for jobs longer than 2 hours.
Prebuilt Squarespace Extensions
Custom Squarespace Extensions: Tell me about the functionality you need

**NEW** Our popular Date Picker Extension and Age Verification Extension are now Squarespace 7.1 compatible.

Share this post


Link to post
  • 0

This is so great!

which part of this would control the "answer" text in a form field question? For example, choosing "yes" or "no" in a multiple choice question - the answers themselves, i.e. "yes" and "no" are still in a tiny font. I have been unsuccessful in changing them using this code and am probably missing something.

You can see an example here:http://www.highcountrycaregiverfoundation.org/program-events/day-break-tues-9-6-2016

see the question "will your care recipient be attending?"

Share this post


Link to post
  • 0

If you only want to change the color of the Form Block fields, you can use this code instead:


 form {}
form input[type="text"],
form textarea {
  color: black !important;
  }





Share this post


Link to post
Guest
This topic is now closed to further replies.

×
×
  • Create New...