Custom CSS class not being applied to Meta Bind Buttons

[ertdes]

What I’m trying to do

Hi all. I have been trying to search for a solution to this but to no avail. I want to insert 2 Meta Bind buttons inline so they look like this:

This is my button definition:

label: Return to home
style: primary
id: return-home
class: navigation-buttons
hidden: True
action:
  type: open
  link: obsidian://open?vault=Notes&file=Home

Things I have tried

This is my custom CSS:

.navigation-buttons {
	font-weight: bold !important;
	width: 49% !important;
	height: auto; 
}

However, nothing happens when I define the button with this CSS class. Having looked at the developer console, the Meta Bind plugin applies my custom CSS class to a <span> element in which the button is defined:

When troubleshooting, I found that if I apply the CSS class to the button definitions themselves, they are formatted to give the desired outcome:

How can I achieve my desired outcome without having to edit the page HTML each time I open the page? This is my first time posting so I hope I’ve explained the issue clearly! Any help would be much appreciated.

[holroy]

Think of the .navigation-buttons as the main anchor and add button to target the button in specific:

.navigation-buttons button {
	font-weight: bold !important;
	width: 49% !important;
	height: auto; 
}

Not tested, but hopefully it works!

[ertdes]

Thank you so much! I spent hours trying to achieve this

[ariehen]

Also, great first post. All the information needed to reproduce (if necessary) and see the issue right away. More of these, please!