Radio button in Jquerymobile
by Prasad
HTML
<div data-role="page" data-theme="c">
<!--Header Begins-->
<div data-role="header" data-theme="c" id="top_header" data-type="horizontal">
<div class="content_left">
<a href="#xyzpan1" data-role="button" data-icon="leftpan" data-iconpos="notext" data-inline="true"></a>
</div>
<div id="logo_img">
<a href="#" data-role="none">
<img src="images/logo.png" height="30" alt="logo">
</a>
</div>
<div class="content_right">
<a data-role="button" href="#" data-icon="search" data-iconpos="notext" data-inline="true" ></a>
<a data-role="button" href="#" data-icon="gear" data-iconpos="notext" data-inline="true"></a>
</div>
</div>
<!--Header Ends-->
<!--contents begins-->
<div data-role="content">
<!--search filter begins-->
<div class="gray">
<input type="search" id="search_basic">
</div>
<!--search filter begins-->
<div class="todays_deal">
<div id="today_deal_title">Today's Deals</div>
<div>
<span id="today_deal_img">
<img src="images/xperias.gif" alt="xperiarc" height="116" width="150">
</span>
<span id="today_deal_imgdesc">
<div id="title">
Xperia Arc S
</div>
<div id="subtitle">
(Black/White)
</div>
<div id="price">
$519
</div>
<div id="buy_btn">
<a href="#" data-role="button" data-theme="b" data-mini="true">Buy Now</a>
</div>
</span>
<div class="clear"></div>
</div>
</div>
<!--today's deal box ends-->
<div class="tbl">
<!--Column Begins-->
<div class="tbl_cols">
...
CSS
/*Content styles*/
.ui-content{border-width:0;overflow:visible;overflow-x:hidden;padding:0 0; background:#dcdcdc;}
/*Button styles*/
/*font family for buttons Helvetica Neuea*/
.ui-listview > .ui-li.ui-first-child,.ui-listview .ui-btn.ui-first-child > .ui-li > .ui-btn-text > .ui-link-inherit{-webkit-border-top-right-radius:2px;border-top-right-radius:2px;-webkit-border-top-left-radius:2px;border-top-left-radius:2px;
border:1px solid #b3b1b1; margin: 3px 0;
}
.ui-btn-up-a{border:1px solid #111;background:#333;font-weight:bold;color:#fff;/*text-shadow:0 1px 1px #111;*/background-image:-webkit-gradient(linear,left top,left bottom,from( #fff ),to( #fff ));background-image:-webkit-linear-gradient( #fff,#fff );background-image:-moz-linear-gradient( #fff,#fff );background-image:-ms-linear-gradient( #fff,#fff );background-image:-o-linear-gradient( #fff,#fff );background-image:linear-gradient( #fff,#fff )}
.ui-btn-up-a:visited,.ui-btn-up-a a.ui-link-inherit{color:#fff}.ui-btn-hover-a{border:1px solid #000;background:#444;font-weight:bold;color:#fff;/*text-shadow:0 1px 1px #111;*/background-image:-webkit-gradient(linear,left top,left bottom,from( #555 ),to( #383838 ));background-image:-webkit-linear-gradient( #555,#383838 );background-image:-moz-linear-gradient( #555,#383838 );background-image:-ms-linear-gradient( #555,#383838 );background-image:-o-linear-gradient( #555,#383838 );background-image:linear-gradient( #555,#383838 )}.ui-btn-hover-a:visited,.ui-btn-hover-a:hover,.ui-btn-hover-a a.ui-link-inherit{color:#fff}.ui-btn-down-a{border:1px solid #000;background:#222;font-weight:bold;color:#fff;text-shadow:0 1px 1px #111;background-image:-webkit-gradient(linear,left top,left bottom,from( #202020 ),to( #2c2c2c ));background-image:-webkit-linear-gradient( #202020,#2c2c2c );background-image:-moz-linear-gradient( #202020,#2c2c2c );background-image:-ms-linear-gradient( #202020,#2c2c2c );background-image:-o-linear-gradient( #202020,#2c2c2c );background-image:linear-gradient(...