How do you change the space between toolbar links?

1

In the below code the two hrefs are at opposite ends equally spaced out.
Want I want is to center all icons on the toolbar and be able to adjust the space between icons.

Current Code:

  <div class="toolbar toolbar-top no-hairline">
        <div class="toolbar-inner">
            <a href="#view-home">
                <i class="icon f7-icons if-not-md">house_fill</i>
                <i class="icon material-icons if-md">home</i>
                <span class="">Home</span>
            </a>

         <a href="#view-settings" class="t">
                <i class="icon f7-icons if-not-md">gear</i>
                <i class="icon material-icons if-md">settings</i>
                <span class="">Settings</span>
            </a>
        </div>
    </div>
2

Use the flex classes.

3
1 Like