Content behind a larger sub-header

ionic-v1
1

I edited the sub-header style so that instead of having a fixed height, its height is now in auto.
I did this so that it can accommodate all the elements inside it.( Is this ok??)

However, upon doing this, the content is behind my larger sub-header.
In this topic, I think what was done is to override the has-subheader and bar-subheader classes.
Is this ok? Will there be an issue if the app is shown in multiple devices?

Here is a sample code:

<ion-view>
<ion-header-bar class="bar-subheader" style="height: auto">
    <div>
        123
    </div>
    <div>
        456
    </div>
    <div class="button-bar">
        <a class="button">A</a>
        <a class="button">B</a>
        <a class="button">C</a>
    </div>
</ion-header-bar>

<ion-content class="has-header has-subheader padding">
    <div style="font-size: 100px">HI !</div>
</ion-content>
</ion-view>

Here’s what it looks like: