Developer Tools: Debug :hover etc. in Chrome

Did you ever try to get a css style for a hovered or active button or link? Today I tried to figure out, why the bootstrap btn-success don’t accepts my :active state style. Searching for a way to get this brings me to the simple solution:

Open developer tools in chrome (ctrl-shift-i or F12), select  the element (crtl-shift-c or the most left button in the menu bar) and then see this:


Click on the dotted button to get the context menu for this element:


Select the states you need and you will see the corresponding style in the style window and on the webpage.

In my case it was the combination of to states:


and not only :active.