css - jquery-mobile header two icons on right side next to each other -
having 3 icons in data-type='header' how place 1 on left , other 2 on right of header panel?
<div data-role="header" data-theme="a" data-position="fixed"> <center><img src="img/logo.png" style="height: 32px;"></center> <a href="#nav-panel" data-icon="bullets" class="ui-alt-icon" data-iconpos="notext" id="headmenu">menu</a> <a href="#" data-icon="recycle" class="ui-alt-icon" data-iconpos="notext" id="refresh">home</a> <a href="#" data-icon="home" class="ui-alt-icon" data-iconpos="notext" id="homebut">home</a> </div>
this place third icon in new row,
i got work around,
html:
<div data-role="header" data-theme="a" data-position="fixed"> <div data-type="horizontal" class="ui-btn-left"> <a href="#nav-panel" data-role="button" data-icon="bullets" class="ui-alt-icon" data-iconpos="notext" id="headmenu">menu</a> </div> <img src="img/logo.png" style="height: 32px;" /> <div data-type="horizontal" class="ui-btn-right" > <a href="index.html" data-role="button" data-icon="arrow-u" data-iconpos="notext">up</a> <a href="#" data-role="button" data-icon="home" data-iconpos="notext" id="homebut">home</a> </div> </div>
css:
.ui-header-fixed{ text-align: center; padding-bottom: 5px; }
a sample js fiddle
Comments
Post a Comment