You can insert infobars either at the top or bottom of pages on your website. They are commonly used to alert visitors about sales, product updates, and other current or upcoming events. Interaction Studio Infobars are partially responsive by default; any content you add to an infobar takes on a definitive height, width, and position. However, if your site is responsive, you can use custom CSS to make the entire infobar behave responsively.
This article details the process for making your infobar responsive and shows an example of one approach.
|You should have a basic working knowledge of CSS and an understanding of responsive behavior.|
These settings ensure that as the visitor resizes the window, any content within the parent div will adjust to fit the entire width of the infobar.
This setting ensures the infobar will resize based on the height of the content within it instead of retaining its initial fixed height.
Once your message looks the way you want it to, test your campaign
As you adjust the size of the screen, the message will adjust to accommodate the size of the content within the confines of the screen size
If needed, you can add a CTA to your infobar and it will also behave responsively.