Block ID Selectors

COMPONENT SELECTOR GUIDE

Block ID Selectors

Relevant CSS Selectors

CSS Selector(s) HTML Element Picture of Element (the blue area highlights the element; the green area highlights the element's padding; the orange area highlights the element's margin)
#block-yui_3_17_2_1_1690691237911_5006 Targets a unique Squarespace element using its unique ID attribute. The selector in the left column is just the general form of the block ID, but the characters that come after "#block-" will be different for each element.

HTML Structure Explanation

Every Squarespace block element will have a class name of “.sqs-block”. This element will additionally have an ID attribute that begins with “block-” and ends with a random string of characters as pictured below.

The <div> element with a class name of “sqs-block” and an ID attribute that begins with “block-” and ends with a string of characters. This particular element is an image block.

Previous
Previous

Specific Page Elements

Next
Next

Blog Listing Page