Firebug. How to use “Break on attribute” feature

This tutorial is going to show you how to fix the position of a drop-down menu using “Break on attribute”  feature in Firebug to change its attributes.

1. Click the Firebug icon in the top right corner of your Firefox browser.
2. Select “Click an element in the page to inspect”.



3. Open the drop-down menu on your template and click on it.



4. In the HTML tab right click <li class=” and select  “Break On Attribute Change”.



5. Refresh the page (select the URL and hit Enter).
6. Hover the mouse cursor over the  menu to see the following:



7. Hit F8 or click “Continue” in the Script tab several times till you see the drop-down menu open.



8. Now the position of the drop-down menu is fixed and you can proceed to changing its attributes.

Feel free to check the detailed video tutorial below:

Firebug. How to use “Break on attribute” feature