Advanced Search

CSS Diagnostics

/ Published in: CSS
Save to your folder(s)
Find mistakes in HTML and highlight the crap out of them

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. /* Empty Elements */
  2. div:empty, span:empty, li:empty, p:empty, td:empty, th:empty
  3. { padding: 20px; border: 5px dotted yellow !important; }
  4.  
  5. /* Empty Attributes */
  6. *[alt=""], *[title=""], *[class=""], *[id=""], a[href=""], a[href="#"]
  7. { border: 5px solid yellow !important; }
  8.  
  9. /* Deprecated Elements */
  10. applet, basefont, center, dir, font, isindex, menu, s, strike, u
  11. { border: 5px dotted red !important; }
  12.  
  13. /* Deprecated Attributes */
  14. *[background], *[bgcolor], *[clear], *[color], *[compact], *[noshade], *[nowrap], *[size], *[start],
  15. *[bottommargin], *[leftmargin], *[rightmargin], *[topmargin], *[marginheight], *[marginwidth], *[alink], *[link], *[text], *[vlink],
  16. *[align], *[valign],
  17. *[hspace], *[vspace],
  18. *[height], *[width],
  19. ul[type], ol[type], li[type]
  20. { border: 5px solid red !important; }
  21.  
  22. /* Proposed Deprecated Elements */
  23. input[type="button"], big, tt
  24. { border: 5px dotted #33FF00 !important; }
  25.  
  26. /* Proposed Deprecated Attributes */
  27. *[border], a[target], table[cellpadding], table[cellspacing], *[name]
  28. { border: 5px solid #33FF00 !important; }
  29.  
  30. /*Eric Meyer�s version*/
  31. div:empty, span:empty,
  32. li:empty, p:empty,
  33. td:empty, th:empty {padding: 0.5em; background: yellow;}
  34.  
  35. *[style], font, center {outline: 5px solid red;}
  36. *[class=""], *[id=""] {outline: 5px dotted red;}
  37.  
  38. img[alt=""] {border: 3px dotted red;}
  39. img:not([alt]) {border: 5px solid red;}
  40. img[title=""] {outline: 3px dotted fuchsia;}
  41. img:not([title]) {outline: 5px solid fuchsia;}
  42.  
  43. table:not([summary]) {outline: 5px solid red;}
  44. table[summary=""] {outline: 3px dotted red;}
  45. th {border: 2px solid red;}
  46. th[scope="col"], th[scope="row"] {border: none;}
  47.  
  48. a[href]:not([title]) {border: 5px solid red;}
  49. a[title=""] {outline: 3px dotted red;}
  50. a[href="#"] {background: lime;}
  51. a[href=""] {background: fuchsia;}

URL: http://css-tricks.com/snippets/css/css-diagnostics/

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.