Archived topic

Header widget padding and placement in mobile

3 replies · Started by Traci on January 25, 2018

Viewing posts 1–4 of 4

January 25, 2018 at 5:30 pm #480071

Based on other topics, I got my Polylang language switcher and the Lightweight Social Icons widget to display the way I want them in the header. Now I have a lot of padding in the header because of the widgets. How do I decrease the padding (top and bottom)?

Also, when I look at the site on a mobile device, the logo is beneath the widgets. How do I switch them?

January 25, 2018 at 6:17 pm #480099

Hi there,

Try this CSS:

.separate-containers .widget {
    margin-bottom: 0px;
}
.header-widget .widget {
    padding-bottom: 0px;
}

Header widget below logo on mobile: https://docs.generatepress.com/article/header-widget/#showing-your-header-widget-below-other-header-elements-on-mobile

Adding CSS: https://docs.generatepress.com/article/adding-css/

January 26, 2018 at 6:43 am #480412

Perfect! It all looks exactly the way I want it to now.

Thanks so much for the amazingly quick reply.

January 26, 2018 at 6:54 am #480496

No problem :)

This archived topic is closed to new replies.

Start building better websites today.