Center an Image Button

What does this code do?

This code snippet will allow you to horizontally center a button in an image block.

 

Code Snippets

Copy and paste this code into Design > Custom CSS

/* Center All Image Buttons */
.image-button-inner {
  text-align: center !important;
}

/* Center Specfic Imaage Buttons */
SELECTOR .image-button-inner {
  text-align: center !important;
}

Then change the word SELECTOR to one of the selectors below.

Squarespace 7.0

/* One Page */
#COLLECTIONID

/* One Section */
#PAGEID

/* One Image Block */
#BLOCKID

Squarespace 7.1

/* One Page */
#COLLECTIONID

/* One Section */
#COLLECTIONID #page .page-section:nth-of-type(1)

/* One Button Block */
#BLOCKID
 

How To Use It

  1. Copy and paste the code snippet as indicated above.

  2. Choose the selector that matches your situation.

  3. To learn how to find a collection id, page id, or block id check out our Start Here guide.

  4. If targeting one section in Squarespace 7.1, change the 1 to match the section you are trying to change.

Rebecca Grace

Rebecca Grace is a Squarespace CSS Expert and Website Designer.

https://rebeccagracedesigns.com
Previous
Previous

Create a Cover Page

Next
Next

Animate Text