Remove bottom padding from buttons in .button-bar


I’d like the buttons inside the button-bar to touch the bottom of the button-bar. The problem is I don’t seen any bottom margin or padding on either. Where does this come from? Does it have something to do with the table layout?


Is this a button bar in an ion-header, subheader or footer? I don’t think the button-bar itself adds any extra space, but it’s parent element probably does.


It looks like this:

Dream Log Therapy

It looks like there is about a 5px margin on the top and bottom of the buttons but I don’t see where it is coming from.


That’s not showing; you need to mark it as source with the </> button


Sorry… I was using IE and I couldn’t see those buttons. It looks like this:

<div class="bar bar-subheader sheet">
    <div class="button-bar">
       <a class="button">Dream Log</div>


The space is because the div enclosing the button-bar has padding set as part of its style.

Try adding style="padding:0px" to the parent div, and if that works, use a suitable class with the right padding instead.