Fork me on GitHub

debugCSS : (X)HTML debugging tool built with CSS

Summary

debugCSS is meant to be loaded on an existing page to highlight potentially broken, malformed or legacy (X)HTML.

Not all "errors" are created equally, so they are color coded to highlight severity. Green is "probably not a big problem", yellow is "worth looking at" and red is "you really should fix this."

Install

Click and drag the link below to your bookmark toolbar to install - or right click "Bookmark This Link".

debugCSS

Get the source code on GitHub : imbrianj/debugCSS

Class / ID Namespace Playground

  • *[class^="1"]

    Class name starting with number
  • *[class^="2"]

    Class name starting with number
  • *[class^="3"]

    Class name starting with number
  • *[class^="4"]

    Class name starting with number
  • *[class^="5"]

    Class name starting with number
  • *[class^="6"]

    Class name starting with number
  • *[class^="7"]

    Class name starting with number
  • *[class^="8"]

    Class name starting with number
  • *[class^="9"]

    Class name starting with number
  • *[class^="0"]

    Class name starting with number
  • *[id^="1"]

    ID starting with number
  • *[id^="2"]

    ID starting with number
  • *[id^="3"]

    ID starting with number
  • *[id^="4"]

    ID starting with number
  • *[id^="5"]

    ID starting with number
  • *[id^="6"]

    ID starting with number
  • *[id^="7"]

    ID starting with number
  • *[id^="8"]

    ID starting with number
  • *[id^="9"]

    ID starting with number
  • *[id^="0"]

    ID starting with number
  • *[class*=\\]

    Class contains a \
  • *[class*=\.]

    Class contains a .
  • *[class*=\#]

    Class contains a #
  • *[class*=\~]

    Class contains a ~
  • *[class*=\!]

    Class contains a !
  • *[class*=\@]

    Class contains a @
  • *[class*=\$]

    Class contains a $
  • *[class*=\%]

    Class contains a %
  • *[class*=\^]

    Class contains a ^
  • *[class*=\&]

    Class contains a &
  • *[class*=\*]

    Class contains a *
  • *[class*=\(]

    Class contains a (
  • *[class*=\)]

    Class contains a )
  • *[class*=\=]

    Class contains a =
  • *[class*=\,]

    Class contains a ,
  • *[class*=\/]

    Class contains a /
  • *[class*=\']

    Class contains a '
  • *[class*=\;]

    Class contains a ;
  • *[class*=\:]

    Class contains a :
  • *[class*=\?]

    Class contains a ?
  • *[class*=\>]

    Class contains a >
  • *[class*=\<]

    Class contains a <
  • *[class*=\[]

    Class contains a [
  • *[class*=\]]

    Class contains a ]
  • *[class*=\{]

    Class contains a {
  • *[class*=\}]

    Class contains a }
  • *[class*=\|]

    Class contains a |
  • *[class*=\`]

    Class contains a `
  • *[id*=\\]

    ID contains a \
  • *[id*=\.]

    ID contains a .
  • *[id*=\#]

    ID contains a #
  • *[id*=\~]

    ID contains a ~
  • *[id*=\!]

    ID contains a !
  • *[id*=\@]

    ID contains a @
  • *[id*=\$]

    ID contains a $
  • *[id*=\%]

    ID contains a %
  • *[id*=\^]

    ID contains a ^
  • *[id*=\&]

    ID contains a &
  • *[id*=\*]

    ID contains a *
  • *[id*=\(]

    ID contains a (
  • *[id*=\)]

    ID contains a )
  • *[id*=\=]

    ID contains a =
  • *[id*=\,]

    ID contains a ,
  • *[id*=\/]

    ID contains a /
  • *[id*=\']

    ID contains a '
  • *[id*=\;]

    ID contains a ;
  • *[id*=\:]

    ID contains a :
  • *[id*=\?]

    ID contains a ?
  • *[id*=\>]

    ID contains a >
  • *[id*=\<]

    ID contains a <
  • *[id*=\[]

    ID contains a [
  • *[id*=\]]

    ID contains a ]
  • *[id*=\{]

    ID contains a {
  • *[id*=\}]

    ID contains a }
  • *[id*=\|]

    ID contains a |
  • *[id*=\`]

    ID contains a `
  • *[class*=left]

    Class contains "left"
  • *[class*=right]:not([class*=opyright])

    Class contains "right" Class contains "copyright" (which is good)
  • *[class*=bottom]

    Class contains "bottom"
  • *[class*=center]

    Class contains "center"
  • *[class*=clear]

    Class contains "clear"
  • *[class*=float]

    Class contains "float"
  • *[class*=large]

    Class contains "large"
  • *[class*=small]

    Class contains "small"
  • *[class*=blue]

    Class contains "blue"
  • *[class*=green]

    Class contains "green"
  • *[class*=yellow]

    Class contains "yellow"
  • *[class*=white]

    Class contains "white"
  • *[class*=black]

    Class contains "black"
  • *[class*=Left]

    Class contains "Left"
  • *[class*=Right]

    Class contains "Right"
  • *[class*=Bottom]

    Class contains "Bottom"
  • *[class*=Center]

    Class contains "Center"
  • *[class*=Clear]

    Class contains "Clear"
  • *[class*=Float]

    Class contains "Float"
  • *[class*=Large]

    Class contains "Large"
  • *[class*=Small]

    Class contains "Small"
  • *[class*=Blue]

    Class contains "Blue"
  • *[class*=Green]

    Class contains "Green"
  • *[class*=Yellow]

    Class contains "Yellow"
  • *[class*=White]

    Class contains "White"
  • *[class*=Black]

    Class contains "Black"
  • *[id*=left]

    ID contains "left"
  • *[id*=right]:not([id*=opyright])

    ID contains "right" ID contains "copyright" (which is good)
  • *[id*=bottom]

    ID contains "bottom"
  • *[id*=center]

    ID contains "center"
  • *[id*=clear]

    ID contains "clear"
  • *[id*=float]

    ID contains "float"
  • *[id*=large]

    ID contains "large"
  • *[id*=small]

    ID contains "small"
  • *[id*=blue]

    ID contains "blue"
  • *[id*=green]

    ID contains "green"
  • *[id*=yellow]

    ID contains "yellow"
  • *[id*=white]

    ID contains "white"
  • *[id*=black]

    ID contains "black"
  • *[id*=Left]

    ID contains "Left"
  • *[id*=Right]

    ID contains "Right"
  • *[id*=Bottom]

    ID contains "Bottom"
  • *[id*=Center]

    ID contains "Center"
  • *[id*=Clear]

    ID contains "Clear"
  • *[id*=Float]

    ID contains "Float"
  • *[id*=Large]

    ID contains "Large"
  • *[id*=Small]

    ID contains "Small"
  • *[id*=Blue]

    ID contains "Blue"
  • *[id*=Green]

    ID contains "Green"
  • *[id*=Yellow]

    ID contains "Yellow"
  • *[id*=White]

    ID contains "White"
  • *[id*=Black]

    ID contains "Black"