Posted By

frederick on 07/10/10


Tagged


Versions (?)

CSS selectors in IE6 and IE7 with jQuery


 / Published in: HTML
 

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.  
  4. <head>
  5.  
  6. <style type="text/css">
  7.  
  8.  
  9. #test input.text {
  10. background-color:red !important;
  11. width:270px;height:25px;
  12. padding:0px 5px;
  13. font-size:12px;line-height:25px;
  14. color:#333 !important;
  15. float:left;
  16. border:1px inset #666;
  17. }
  18.  
  19. #test input[type=text] {
  20. background-color:green !important;
  21. width:270px;height:25px;
  22. padding:0px 5px;
  23. font-size:12px;line-height:25px;
  24. color:#333 !important;
  25. float:left;
  26. border:1px inset #666;
  27. }
  28.  
  29. </style>
  30.  
  31. <script type="text/javascript" src="./jquery-1.4.2.min.js"></script>
  32.  
  33.  
  34. <!-- IE6 and IE7 FIX: WIll add class in jsview -->
  35. <script type="text/javascript">
  36. // <![CDATA[
  37. $(document).ready(function(){
  38. $("#test input[type=text]").addClass("text");
  39. $("#module_global-form div input[type=submit]").addClass("submit");
  40. $(".form-section .section_content div input[id*=date]").addClass("text_short");
  41. $(".form-section .section_content div input[id*=time]").addClass("text_short");
  42. $(".form-section .section_content div input[id*=vehicles]").addClass("text_short");
  43. $(".form-section .section_content div input[id*=dob]").addClass("text_short");
  44. $(".form-section .section_content div input[id*=age]").addClass("text_short");
  45. $(".form-section .section_content div input[id*=grade]").addClass("text_short");
  46. $(".form-section .section_content div input[id*=attendance]").addClass("text_short");
  47. $(".form-section .section_content div input[id*=school_phone]").addClass("text_short");
  48. });
  49. // ]]>
  50. </script>
  51.  
  52. </head>
  53. <body>
  54.  
  55. <div id="test">
  56. <label>test this</label></label><input value="" name="" id="" type="text" />
  57. </div>
  58.  
  59. </body>
  60. </html>

Report this snippet  

You need to login to post a comment.