Alineando el título del encabezado móvil Jquery

Solo me pregunto si alguien sabía cómo anular el comportamiento predeterminado en Jquery mobile para alinear el título del encabezado a la izquierda y mantener el mismo formato. Parece que no puedo alinearlo. Esto es lo que tengo:

<div class="ui-body-x" data-role="header" data-position="fixed">
  <div class="ui-grid-x">
    <h1 class="ui-link">Add New Record</h1>
    <div data-type="horizontal" style="top:5px;position:absolute;float:right;z-index:10;display:inline;" align="right" class="ui-btn-right"> 
        <a href="www.google.com" data-role="link" data-icon="settings" data-ajax="false">Cancel</a>
        <a href="www.google.com" class="ui-btn-up-x" data-role="button" data-icon="" data-ajax="false">Submit</a> 
    </div>
  </div>                                    
</div><!-- /header -->

now esto con éxito mueve el encabezado hacia la izquierda, pero el texto no tiene el mismo formato. Crece enorme y el espacio está mal. ¿Alguien ha tenido éxito alineando el encabezado? Gracias por adelantado

Lo siento si esta es una pregunta novata. Ahora estoy pasando a la web desde aplicaciones móviles nativas ...

Respuestas a la pregunta(2)

Su respuesta a la pregunta