How to reduce Height of Menu Bar, Mast Head and Spacing between Menu Items?

Hi Anil

Thanks for reaching out. 1 and 2 are available under Appearance > Customize in Vantage Premium. If you’d like to stick with Vantage Free we’ll run you through some CSS you can insert into a plugin like Jetpack Custom CSS.

1. Add the following to your Custom CSS plugin, edit as required:

/* Vantage Menu Padding - Vertical */

.main-navigation ul li a {
padding-top: 20px;
padding-bottom: 20px;
}

2. Add the following to your Custom CSS plugin, edit as required:

/* Vantage Header Padding */

header#masthead .hgroup {
padding-top: 35px !important;
padding-bottom: 35px !important;
}

3. Add the following to your Custom CSS plugin, edit as required:

/* Menu Padding Horizontal */

.main-navigation ul li a {
padding-right: 25px !important;
padding-left: 25px !important;
}

4. A bit harder at the moment as we have some cross overs between old row styles in Vantage and new ones in Page Builder; we’re working on this problem. For now try:

a. Edit the row, click the Theme tab on the right and click the No Bottom Margin checkbox.
b. Edit the row, click the Attributes tab on the right. Enter your own custom row class, something like this:

custom-bottom-margin

Then under Appearance > Custom CSS (Vantage Premium) or in your own Custom CSS plugin, target that class:

.custom-bottom-margin {
margin-bottom: 10px;
}

For sure :)