change footer widget widths

  • Resolved dhalterman

    (@dhalterman)


    3 years, 1 month ago

    Hi. I’ve searched high and low, but haven’t been able to find a solution to what I think should be an easy fix. The Hestia theme has three footer widgets. I want an image in the first one (NSF logo) and text in the second. I would like to adjust the width of the columns so that the first is only about 25% of the width of the page and the second (with the text) takes up the rest of the width. I haven’t been able to find any settings that allow me to adjust the widths in this way. I’ve tried using CSS codes that people have used, but none seem to change the width of the columns. Thanks!

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

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hi @dhalterman,

    Thanks for choosing Hestia!

    It’s possible to set the width of the footer widgets by adding the code below in the Additional CSS section within the Customizer.

    .content {
    max-width: 25% !important;
}

.hestia-bottom-footer-content .copyright.pull-right {
    max-width: 75% !important;
}

    Have a nice day!

    Thread Starter dhalterman

    (@dhalterman)

    Unfortunately that doesn’t look like it changed what I was thinking about. Sorry for the confusion. When I pasted the code above into the “Additional CSS” box, it changed the width of the columns in the “blog” section. I want to change the width of the columns below that with the NSF logo and the text. Basically, I would like the NSF logo to be on the left and then “This material is based upon work supported…” text to stretch all the way to the right side of the page. Then I can remove the footer at the bottom, which has the text duplicated.

    • This reply was modified 3 years ago by dhalterman.
    AC

    (@purplecodes)

    Themeisle Support

    Hi @dhalterman,

    If you would like the footer to look like this: https://vertis.d.pr/n9hlEh
    You can try adding the snippet below:

    .col-md-4 {
    width: 25% !important;
}

.textwidget {
    max-width: 350% !important;
    width: max-content;
}

    Let us know if this works for you.

    Thread Starter dhalterman

    (@dhalterman)

    @purplecodes That is exactly what I was looking for. Thank you!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘change footer widget widths’ is closed to new replies.