How to inspect css hover , active property using firebug
Join the DZone community and get the full member experience.Join For Free
i am sure that while design and development of a website you definitely want to see the :hover property of an element using your favorite addon in firefox called firebug . but i have found that many newbie developers do not know how to see this property. default settings of firebug shows only the “default style” and not the “pesudo style” .
to see the pseudo styles follow the steps below -
- activate the element inspector on the link which needs to be updated.
- select the :hover pseudo-class menu item in the style tab’s drop-down menu (on the right hand panel) as shownin the image below.
- edit the css rules as usual.
that is a small but nifty trick. i am sure it will save you some time while debugging css. hope it helps.
Opinions expressed by DZone contributors are their own.