Home › Forums › WoodMart support forum › Topbar button gap

Topbar button gap

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • November 3, 2026 at 4:49 pm #731563

    mralperem
    Participant

    Hi,

    I’m trying to adjust the spacing around a button in the header’s top bar, but I can’t seem to find an option for this in the Header Builder or Theme Settings.

    While inspecting the element, I found that the spacing appears to come from this CSS rule:

    .whb-column > .wd-button-wrapper {
    padding: 10px;
    }

    I can override this using Additional CSS, but I’d prefer to use a built-in WoodMart setting if one is available.

    Is there a setting in the Header Builder or Theme Settings that allows me to control the padding or spacing of buttons within a header column?

    Thanks in advance!

    November 4, 2026 at 10:46 am #731587

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    There’s no built-in setting for this. Neither the Header Builder Button element nor Theme Settings has an option to change the padding around a button in a header column. The spacing comes from the theme’s default styles, so the way to change it is with custom CSS.

    If you only want to change the buttons in the top bar, you can use a rule like this:

    .whb-top-bar .whb-column > .wd-button-wrapper {
 padding: 0 5px; 
}

    Change the value to the spacing you want. You can add it under Theme Settings > Custom CSS.

    If you need extra space between the button and another header element, you can also add the Space element in the Header Builder and set its Space width.

    Best Regards,

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)