Pro Footer Help (wrapping)

[bizlynx]

Ive got a footer working somewhat adequately in pro but am having trouble with a few things.

http://stgeorge.carteblanche.media

1. The social icons, I cannot figure out how to make them beside each other rather then stacked.
2. On Mobile it looks VERY bad, it overlaps outside of its container.

[Prasant]

Hello @bizlynx,

Thanks for asking.

1. In your case for footer social icons I suggest you to use Global Block feature from X > Global Block and add social icon element. After that you need to add Global Block element in footer builder to display the icons. I have recorded a screencast that you can take a look to get started. https://cloudup.com/cnixRb_-3iX
2. I can confirm that on mobile footer layout is not proper. To fix that you need to select wrap children under Flex Layout.

Let us know how it goes.

Thanks.

[bizlynx]

1. thanks ill check into that now

2. Wrap Children has always been selected
   

[Prasant]

Hello @bizlynx,

Thanks for asking.

You first need to add a class under Bar > Customize > Class and after that add following CSS under Pro > Theme Options > CSS:

@media only screen and (max-width: 600px) {
    .responsive-footer {
    height: auto !important;
}
}

You have the option to change class name i.e responsive-footer as per requirement.

Let us know how it goes.

If you would like to learn CSS, I am sharing few resources that you take a look to get started with CSS and an interesting tool that you can use to speed up the development process.

I recommend you to watch following video that will help you to get started with CSS.

https://www.youtube.com/watch?v=MFR4WXiLzpc

Sometimes it can get a bit difficult to find out the right selector to be able to write the required CSS codes. A handy tool that can help you in this is Google Chrome dev tools. I am sharing the resource that you can refer to get started with dev tools.

https://developers.google.com/web/tools/chrome-devtools/css/

https://developers.google.com/web/tools/chrome-devtools/

https://www.youtube.com/watch?v=tP_kXBJWPhQ&t=200s

Thanks.