Announcement Bar Elements
COMPONENT SELECTOR GUIDE
Announcement Bar Elements
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) |
|---|---|---|
| .sqs-announcement-bar-dropzone | The announcement bar outer element. |
|
| .sqs-announcement-bar-dropzone .sqs-announcement-bar | The announcement bar inner element. |
|
| .sqs-announcement-bar-dropzone .sqs-announcement-bar-text | The announcement bar text container. |
|
| .sqs-announcement-bar-dropzone #announcement-bar-text-inner-id p | The announcement bar text. |
|
| .sqs-announcement-bar-dropzone .sqs-announcement-bar-close | The "Close" button container. |
|
| .sqs-announcement-bar-dropzone .sqs-announcement-bar-close:after | The "Close" button pseudo-element used to add the "x". |
|
HTML Structure Explanation
The HTML structure of the Announcement Bar elements.
The HTML structure of the Announcement Bar elements.