0

I'm creating a cordova app using jquerymobile. Is there a way to change the size of jquerymobile's navbar icon that I use in the footer section?

The following is the html script that I use for the footer

<div data-role="footer" data-position="fixed">
<div data-role="navbar">
<ul>
<li><a href="#welcome_page" class="uibtn-active" data-icon="home" data-transition="slide">Home</a></li>
<li><a href="#usages" data-icon="tag" data-transition="slide">Usage</a></li>
<li><a href="#accounts" data-icon="edit" data-transition="slide">Accounts</a></li>
<li><a href="#status" data-icon="eye" data-transition="slide">Status</a></li>
<li><a href="#contacts" data-icon="info" data-transition="slide">Contact</a></li>
</ul>
</div>
</div>
zcionn
  • 71
  • 6

2 Answers2

0

jsFiddle

.ui-btn-icon-left:after, .ui-btn-icon-right:after, .ui-btn-icon-top:after, .ui-btn-icon-bottom:after, .ui-btn-icon-notext:after
{
    width:50%;
    height:50px;
    position:relative;
    left:40%
}
AtanuCSE
  • 8,832
  • 14
  • 74
  • 112
  • Thanks Atanu, but it seems it only increases the size of the container of the icon not the icon itself. is there no way to increase the size of the icon too? – zcionn Mar 17 '15 at 01:02
0
.ui-btn-icon-top::after{
    background-size: 22px 22px;
}
Chris
  • 1