Home Forums Pro Themes Education Hub Pro Set the width of the footer widgets?

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #18043
    teccs
    Participant

    I would like to change the width of the containing blocks for the footer widgets, but see no way to do this. I see that I can change the number of footer widgets, but they seem to divide the full width of the footer area into equal proportions. I would like to have 4 footer widgets, each being 20% of the width of the whole footer area, and have two 10% margins on either side of the 4 widgets. Is this possible?

    #18058
    wensolutions
    Keymaster

    Hello @teccs,

    To make changes to your footer widget area as per your requests, you will need to go to your Admin Dashboard > Appearance > Customize > Theme Options > Advanced Options > Custom CSS field and paste in the following Custom CSS :

    @media only screen and (min-width: 1200px) {
        .footer-active-4 { 
            width: 20%;
        }
    
        #footer-widgets .container {
             width: 100%; 
        }
    
        .footer-active-4:first-child {
               margin-left: 10%;
        }
    }

    Save and publish your changes and it should address your requested layout in the footer widget area.

    Hope this resolves your issue,

    Best Regards !!

    #18077
    teccs
    Participant

    This worked, thank you very much. A quick follow up question – is there a list of the CSS selectors for the layout? The names all make sense after the fact, but it would be nice to be able to just look up the layout elements and be able to figure out what CSS customizations are required.

    #18148
    wensolutions
    Keymaster

    Hello @teccs,

    Glad to know your issue is resolved.

    For your query regarding the CSS Selectors for the theme layout, please find below the list of CSS selectors below that will help you to make your custom CSS implementations through the Custom CSS option available in the theme :

    .site-layout-fluid
    .site-layout-boxed
    .global-layout-no-sidebar
    .global-layout-three-columns
    .global-layout-left-sidebar

    Hope this helps,

    Best Regards !!

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.