Ion-header css and javascript framework can't seem to achieve the same visual result

Hey all,

anyone who can tell me why

<ion-header-bar align-title="left" class="bar-positive">
    <button class="button button-icon ion-ios7-arrow-back"></button>
    <h1 class="h1 title">bar-positive</h1>
</ion-header-bar>

and

<div class="bar bar-header bar-positive">
    <button class="button button-icon icon ion-ios7-arrow-back"></button>
    <h1 class="title">bar-positive</h1>
</div>

Do not resolve to the same result? The first result gives a header bar with a button and a title directly next to the button, whilst the second option gives a header bar with a left button and a centered title: something I would think everybody wants?

Am I doing something wrong here?