Firepath - Inspect element by css

Prerequisite:
Firebug addon is already installed in firefox browser.
Firepath addon is already installed.

1. Navigate to the web page url,
    launch firebug addon..

2. Select 'css'

3. Click on the arrow icon to inspect the element,
    click the inspect icon(i.e. arrow icon) and move the mouse over the element to which you want to get the CSS locator. 

 

 

5. Re-verifying the css locator in selenium-ide (Prerequisite: Selenium IDE is already installed in firefox browser).
   launch the selenium-ide, stop the recording.
   copy the css locator and paste in selenium-ide.
   ex: .downloadBox>a

 Type 'css=' in target field.

 

6. click on 'Find' button in selenium-ide, element related to css locator is highlighted in the browser.

Note:
If the css locator is representing multiple elements in the browser.
Then css locator need to be modified, to uniquely identify identify the element.