Jump to content

Customizing contact form borders and fields

Recommended Posts

Site URL: http://www.sauseofsound.com/contact

I am having an issue in 7.1 where I am trying to achieve a simple underlined contact form, except when you click on each field to type, there is a bounding box that appears (see picture). I can't figure out how to get rid of this. Anyone else run into this or have solutions?

This is the code that I am using–
.form-wrapper .field-list .field .field-element{border-top:none!important; borderleft:
none!important; border-right:none!important; border-bottom:2px solid
#615348!important; background-color:transparent!important;

Screen Shot 2021-04-27 at 20.12.59.png

Link to comment

Add this code to Design > Custom CSS

/* form block outline */
.form-block *:focus {
    outline-color: transparent !important;


Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.