How do I style a container on my website?

How do I style a container on my website?

In each container there are three styling options:


Alignment

Container

Frame



Alignment changes the position of your first element: top, center, or bottom

Top alignment:



Center alignment:



Bottom alignment:



Select Span Settings and then select the Container icon. The following are your styling options:


·         Container Image


·         Add Container Color


·         Container Position


·         Remove Element on Mobile


Select the Container icon to add a container image.


Drag and drop an image or click to upload one from the Media Library.



The container image has now been added.

Note: More of the image will be visible once you add additional elements.  




Add a color overlay to the image under “Add Container Color”. Adjust the transparency under “Transparency”.



Image dimension set to 100:



Image dimension set to 60:
                    


Adjust the position of the background image under “Container Position”. By default, the image is set to center. Adjust the image left to right and top to bottom.



Select “Remove Element on Mobile” to hide an element when viewed on a mobile device.

    • Related Articles

    • How do I add a background image to a container on my website?

      Select Column Settings. ·         Select the Image icon to add a container image. Drag and drop an image or click to upload one from our Media Library. The container image has now been added. Note: More of the image will be visible once you add ...

    • How do I add a background image to my website?

      To add a background image to a block or website section, select the Manage Your Site tile.  Hover over the block and select the gear icon.  Select the Media icon. Drag and drop an image from your computer or select the drop-down option to browse ...

    • How do I adjust the style of the map on my website?

      To adjust the style of your map, select the Manage Your Site tile. Select the map and then select the Styling icon. The following are your map background options: Original, Light, Dark, and Greyscale Original                    Light    ...

    • How do I adjust the background color on my website's header?

      Video Walkthrough: To make updates to your website's header, select the Manage Your Site tile. Hover over the header section and select the gear icon. Select “Style” to style your header.   To change your main background color, select a color from ...

    • How do I change the dimension of an image in a container on my website?

      Select Column Settings. Select the Image/Color icon. Scroll down to Container Image Dimensions and use the bar to adjust the dimensions. These are advanced options. We recommend using the default settings.