How to know the correct selector/group of selector for any html element quickly? I’m working on very long bloated html code. and want to apply css on some specfic areas but it’s taking to so much time to find a right css selector for any deeply nested html tag in tables.
for example
#id1 #id2 .class1 .class2 table.no1 tbody td
Is there any quick way or tool to know perfect css selector for any needed elemnt quickly?
I also need to override some css on some elements?
Edit:
After to get answer from @BalucC
In addition i also found this tool for IE users it work same like Web developer toolbar”
MRI: test your selectors
MRI is a bookmarklet for Internet Explorer 6+, and Webkit and Mozilla based browsers (including Safari, Firefox, Camino or Mozilla). Use it to test and play with selectors.
http://www.westciv.com/mri/
The Web Developer Toolbar helps me a lot with this. Just do Ctrl+Shift+F, click the element of interest and check the element chain in the bottom of the toolbar or the Ancestors listing.
Here’s a screen (click for full):