Square Header Buttons

http://stackoverflow.com/q/11046653/190695

HTML

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css">
<div data-role="page">
    <div data-role="header">
        <a data-icon="arrow-l" data-inline="true" data-iconpos="notext" data-corners="true">A Button</a>
        <h1>Page One</h1>
        <a data-icon="arrow-r" data-inline="true" data-iconpos="notext" data-corners="true">B Button</a>
    </div>
    <div data-role="content">
        <a href="#page2" data-role="button">Page 2</a>
    </div>
</div>

CSS

.ui-header .ui-btn, .ui-header .ui-icon, .ui-header .ui-btn-inner {
    width: 35px;
    height: 35px;
}
.ui-header .ui-btn-inner .ui-icon{
    margin: 0px;
    border-radius: 0;
}
.ui-header {
    height: 10px;
}