am just startin new here...i have this css tabs with jquery..\[code\]<ul class="tabs"><li><a href="http://stackoverflow.com/questions/15758521/#tab1">First tab</a></li><li><a href="http://stackoverflow.com/questions/15758521/#tab2">Second tab</a></li></ul><div class="tab_container"><div id="tab1" class="tab_content"> Content of the first tab</div><div id="tab2" class="tab_content">Content</div>\[/code\]myjquery\[code\] <script type="text/javascript"> $(document).ready(function() { //Default Action $(".tab_content").hide(); //Hide all content $("ul.tabs li:first").addClass("active").show(); //Activate first tab $(".tab_content:first").show(); //Show first tab content //On Click Event $("ul.tabs li").click(function() { $("ul.tabs li").removeClass("active"); //Remove any "active" class $(this).addClass("active"); //Add "active" class to selected tab $(".tab_content").hide(); //Hide all tab content var activeTab = $(this).find("a").attr("href"); $(activeTab).fadeIn(); //Fade in the active content return false; }); }); </script>\[/code\]it is working well with form fields, but when i add submit button after the form fields it disappears.. but when only submit button(no other form fields) is used.. it is shown.. i tried to change the css settings, but was not able to figure out.. am trying my best to be clear here.. and the css\[code\] ul.tabs { margin: 0; padding: 0; float: left; list-style: none; height: 32px; /*--Set height of tabs--*/ border-bottom: 1px solid #999; border-left: 1px solid #999; width: 100%; } ul.tabs li { float: left; margin: 0; padding: 0; height: 31px; /*--Subtract 1px from the height of the unordered list--*/ line-height: 31px; /*--Vertically aligns the text within the tab--*/ border: 1px solid #999; border-left: none; margin-bottom: -1px; /*--Pull the list item down 1px--*/ overflow: hidden; position: relative; background: #e0e0e0; } ul.tabs li a { text-decoration: none; color: #000; display: block; font-size: 1.2em; padding: 0 20px; border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/ outline: none; } ul.tabs li a:hover { background: #ccc; } html ul.tabs li.active, html ul.tabs li.active a:hover { /*--Makes sure that the active tab does not listen to the hover properties--*/ background: #fff; border-bottom: 1px solid #fff; /*--Makes the active tab look like it's connected with its content--*/ } .tab_container { border: 1px solid #999; border-top: none; overflow: hidden; clear: both; float: left; width: 100%; background: #fff; } .tab_content { padding: 20px; font-size: 1.2em; color:#333; }\[/code\]pls help!! wat am i doing wrong...my html form code \[code\] <label for="username" id="name_label">Username</label><br> <input id="username" type="text" name="username"/><br> <label for="password" id="name_label">Password</label><br> <input id="password" type="text" name="password"/><br> <label for="confirm_password" id="name_label">Confirm Password</label> <br> <input id="confirm_password" type="text" name="confirm_password"/><br> <br> <b>Personal Details</b><br><br> <label for="firstname" id="name_label">Firstname</label><br> <input id="firstname" type="text" name="firstname"/><br> <label for="lastname" id="name_label">Lastname</label><br> <input id="lastname" type="text" name="lastname"/><br> Gender<br> <select class="cc" name="sex" id="sex"> <option value="" selected="selected">--Select Gender--</option> <option value="http://stackoverflow.com/questions/15758521/m">Male</option> <option value="http://stackoverflow.com/questions/15758521/f">Female</option> </select> <br> Date of birth<br> <label class="dob" for="dateid" id="date_label">Date <?php $number = range(1,31); $tempholder = range(1,31); $nr=31; echo '<select class="doba" name="dateid" id="dateid">'; echo '<option value="" selected="selected">--Select Date--</option>'; for ($i=0; $i<$nr; $i++) { echo "<option>".$tempholder[$i]."</option>"; } echo '</select>'; ?> </label> <label class="dob" for="month" id="month_label">Month <?php $number = range(1,12); $tempholder = range(1,12); $nr=12; echo '<select class="doba" name="month" id="month">'; echo '<option value="" selected="selected">--Select Month--</option>'; for ($i=0; $i<$nr; $i++) { echo "<option>".$tempholder[$i]."</option>"; } echo '</select>'; ?> </label> <label class="dob" for="year" id="year_label">Year <?php $tempholder = range(1960,2000); $nr=40; echo ' <select class="doba" name="year" id="year">'; echo '<option value="" selected="selected">--Select Year--</option>'; for ($i=0; $i<$nr; $i++) { echo "<option>".$tempholder[$i]."</option>"; } echo '</select>'; ?> </label> <br> <b>Contact Details</b> <br> <label for="add1" id="add1_label">Address1</label><br> <input id="add1" type="text" name="add1"/><br> <label for="add2" id="add2_label">Address2</label><br> <input id="add2" type="text" name="add2"/><br> <label for="add3" id="add3_label">Address3</label><br> <input id="add3" type="text" name="add3"/><br> <label for="mobile" id="mobile_label">Mobile</label><br> <input id="mobile" type="text" name="mobile"/><br> <label for="tele" id="tele_label">Telephone</label><br> <input id="tele" type="text" name="tele"/><br> <label for="email" id="email_label">E-mail</label><br> <input id="email" type="text" name="email"/><br> <br> <b>Card Details</b><br> <label for="cardno" id="cardno_label">Card No</label><br> <input id="cardno" type="text" name="cardno"/><br> <label for="cvcno" id="cvcno_label">CVC No</label><br> <input id="cvcno" type="text" name="cvcno"/><br> <label class="dob" for="dateid" id="date_label">Expiry Date<br> <?php $number = range(1,31); $tempholder = range(1,31); $nr=31; echo '<select class="doba" name="dateid" id="dateid">'; echo '<option value="" selected="selected">--Select Date--</option>'; for ($i=0; $i<$nr; $i++) { echo "<option>".$tempholder[$i]."</option>"; } echo '</select>'; ?> </label> <label class="dob" for="month" id="month_label">Month <?php $number = range(1,12); $tempholder = range(1,12); $nr=12; echo '<select class="doba" name="month" id="month">'; echo '<option value="" selected="selected">--Select Month--</option>'; for ($i=0; $i<$nr; $i++) { echo "<option>".$tempholder[$i]."</option>"; } echo '</select>'; ?> </label> <label class="dob" for="year" id="year_label">Year <?php $tempholder = range(2013,2050); $nr=40; echo ' <select class="doba" name="year" id="year">'; echo '<option value="" selected="selected">--Select Year--</option>'; for ($i=0; $i<$nr; $i++) { echo "<option>".$tempholder[$i]."</option>"; } break; echo '</select>'; ?> </label> <br> <select name="cardtype" id="cardtype"> <option value="" selected="selected">--Card Type--</option> <option value="http://stackoverflow.com/questions/15758521/visa">Visa</option> <option value="http://stackoverflow.com/questions/15758521/master">Master</option> <option value="http://stackoverflow.com/questions/15758521/american">American Express</option> </select> <input type="submit" value="http://stackoverflow.com/questions/15758521/enter"/>\[/code\]
simple css tabbed menu-submit not shown
- Thread starter aatif
- Start date