[Graham]

Hi Sakin, I’m looking to adjust my header sidebar. It has a text widget for my phone number and the social icons. I’d like to remove most if not all of the gap between those two parts of the sidebar. Currently it’s distorting the CSS that I’ve already done for my header. Ultimately I’d like the gaps to the edge of the header to be equidistant to those of the logo image to have some symmetry.

Not sure if this needs to be added to the Custom CSS box or the stylesheet.

Thanks for any help you can offer!

Best,
Graham
media-cracker.com

[Graham]

Update: I was able to figure out some CSS to get it looking the way I want but it’s all messed up on mobile now. Can you take a look at what the phone number and social icons are doing on a mobile device and let me know what’s going on?

Thanks,
Graham

[Sakin]

@Graham: You need to remove the following CSS from your Custom CSS:

#header-right.header-sidebar.widget-area {
    height: 10px;
}
#header-right.header-sidebar.widget-area {
    margin-bottom: 0;
    padding-top: 10px;
}
#text-2.widget.widget_text {
    height: 5px;
}

Then add the following CSS in your Custom CSS
#text-2.widget.widget_text { margin-bottom: 0; }

[Author]

Posts