Footer widget area – full width

  • Resolved timmoser

    (@timmoser)


    6 years, 6 months ago

    Ahoi,
    Thank you for the great theme.
    The people I am designing a page for just decided that they want the social icons plugin in the same “bar/area” as the copyright.
    Since I have purchased the bento expansion pack I simply deleted the copyright under customize>site identity, which makes the copyright area disappear and then put three widgets into the widget area one “custom html” with only &nbsp a social icons widget and another “custom html” with the copyright text.
    I put the “blank” html widget in there to make sure the social icons would be in the center.
    This works fine.
    However the copyright text is far from the right side.
    It seems to me that that the footer widget area (.bnt-container) is only as wide as the default content area.

    How do I make the footer widget area (.bnt-container) full width ?

    I want to end up with the copyright sentence I put in the “custom html” widget in the same position (laterally) as it was when it was in the copyright area (site identity) and the social icons centered.

    Also how do i reduce the top and bottom padding of div. widget-area.sidebar-footer.clear?

    I cant really code, just copy paste and alter.
    I have a child theme and I know where to find the custom css option.
    Thank you!

    Regards
    Tim

    • This topic was modified 6 years, 6 months ago by timmoser.

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Theme Author satoristudio

    (@satoristudio)

    Hey Tim,

    first of all, thanks for choosing Bento, and – cool tech you’re working on!

    If I understood correctly, you’d like to move the copyright statement to the right, while leaving the social icons intact at the center of the footer. In that case you can use this snippet to force the footer container to stretch to the screen width, not the content width:
    .site-footer .bnt-containter { margin: 0 !important; padding: 0 5% !important; }

    In case I’m missing the point here, please let me know!

    Thread Starter timmoser

    (@timmoser)

    Ahoy,
    Thanks for the quick and professional response.
    I do think that you are addressing exactly the right point.
    Unfortunately however, adding the above code under customize>additional css did not have any noticeable effect, even after purging the cache.
    I changed the padding and margin levels to some random values between 100 and 1000 and no effect is visible either.

    Any other ideas?

    AddWeb Solution

    (@addweb-solution-pvt-ltd)

    Hello @timmoser,

    You can use below CSS in your custom style.css file or add in Appearance -> Customize -> Additional CSS, to resolve your issue regarding the fooder area spacing and alignments.

    .site-footer .sidebar-footer {
  padding: 15px 0 0 0;
}
.site-footer .bnt-container {
  margin: 0 !important;
  padding: 0 5% !important;
  max-width: inherit;
}
.site-footer .zoom-social-icons-widget {
  text-align: center;
}

    Thanks.

    Thread Starter timmoser

    (@timmoser)

    Ahoy @addwebb,

    Perfect!!
    Exactly what i wanted
    Thank you very much.

    Resolved.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Footer widget area – full width’ is closed to new replies.

Tags