Position button (image with no next) inside header (background image)
Hi,
the problem with button with image and no text is the size / shape of the button is a 9px circle regardless of the size of the image.
I was able to make it work by overwriting sizes in ui-btn size, but it does not scale (i cannot define button with other sizes).
Is there a better way than the following?
<div data-role="header">
<h1></h1>
<div style="position: absolute; top: 0px; margin-left: 540px;">
<a href="#two" data-role="button" data-transition="slide"
data-icon="list-view" data-iconpos="notext" data-theme="list-view">List-View</a>
</div>
</div>
.ui-header .ui-title {
background-image: url(../img/top.png);
background-repeat: no-repeat;
width: 720px;
height: 110px;
margin: 0;
padding: 0;
font-size: 0px;
}
/* problem doing this... */
.ui-btn {
width: 164px;
height: 70px;
float: right;
}
.ui-icon-list-view {
background: url(../img/btn-list-view.png) no-repeat;
width: 100%;
height: 100%;
}