It’s all in the image if it works :)
I want the padding removed from the
#header-sidebardiv. If I remove in the inspector (as well as a height later down the track) the menu goes to the top of the header area as I would like. I just can’t determine where this inline style is set.
I’ve already tried
!importantafter my own definition, and it’s not overriding :(
I can style ever other element of the menu elsewhere without a problem, I just can’t get to this because it’s an element/inline style.
The menu is created through the normal menu structure, and is positioned in the header through the “custom menu” widget.
note: I think the image needs the ?dl=0 at the end to be viewed
URL: https://www.dropbox.com/s/u9on43uezaxtkmr/Screenshot%202015-09-30%2010.38.54.png?dl=0
Hi Madivad
You can fix/change this with some custom CSS. If you navigate to Appearance > Custom CSS, you’ll get our custom CSS editor. Just add the following code.
/* Vantage Header Sidebar Padding */header#masthead .hgroup #header-sidebar[style] {padding-top: 0 !important;padding-bottom: 0 !important;}You’ve just beat me, I was just coming in here to update this. I’d finally got to the bottom of it about half hour ago.
I have a lot to learn about CSS…
I had:
#header-sidebar { padding-top: 0px; padding-bottom: 0px; margin-top: 0px; height: 0px; }even with important, but that didn’t work (I knew form the inspector I needed the height in there as well)…
But using SiteOrigin’s Custom CSS I worked out I needed:
#masthead .hgroup #header-sidebar {...Add that in front and it was enough to seal the deal. I’m sure I’ll get it one day :D
Thanks for getting back to me Andrew, cheers.
Not an ordinary case. Vantage uses JavaScript to measure the header height and then adding top and bottom padding to the header sidebar in an inline style tag in order to centre the widget area. Here is how you override inline styles: https://css-tricks.com/override-inline-styles-with-css/. No other way.
Glad you’re making progress.