When using Firebug, which stylesheet is being referenced?

[sofasurfer]

When using Firebug, I click "inspect". Then I click the part of the page I want to know about. Then I see that Firebug has highlighted the relevant section of html code in the left hand panel. And in the right hand panel are references to stylesheets. I do not understand what they are telling me.
Why are there multiple stylesheet references?
When I click on a stylesheet line number reference and it takes me to a css listing, I then click on the sytlesheet css dropdown box. Is the path in the box the path to the stylesheet that I am to edit?

Hopefully this makes sense.

[haredo]

The easiest way to learn is google this: youtube Firebug

But I can try to type it to you...

1. What firebug does is allow you to change div id's and class property colors on the fly to see the visual changes in front of you and if you like then edit the original sheet and upload to your server..
2. When I click home on your web site..
3. I see the wording: WELCOME TO EARLY 1900 PHOTOS!
4. click the little bug to activate and click the square with the arrow to activate the process..
5. now notice the page start changing with squares around wording as you move your mouse..
6. Move your mouse over this: WELCOME TO EARLY 1900 PHOTOS! and you should see a blue square around it: Now click you left side of mouse..
7. You now have in the firebug pane a highlighed div id which is: <h1 id="indexDefaultHeading">WELCOME TO EARLY 1900 PHOTOS!</h1>
8. notice to the right side of pane the css is highlighted also with many id's and classes
9. So basically in the left pane you can click around on any div, class or + sign and watch screen change above and to the right highlighting areas to change..
10. with this clicked now on left pane: <h1 id="indexDefaultHeading">WELCOME TO EARLY 1900 PHOTOS!</h1>
11. Look in right pane and see:
    #indexDefaultHeading {
    color: #000000;
    }
12. Double click the 000000
13. make sure there is a # and change to #ff0000
14. sweet now the wording changes to red.
15. lay your mouse on on stylesheet #1186
16. a small window should pop up telling you the path to edit..
17. you will see this: http:// early1900photos.com/ includes/templates/freetemplate2/css/stylesheet.css
18. So your fix is following the path with a text editor and change the div id color to your preference.
19. freetemplate2/css/stylesheet.css
20. or lay your mouse on #1186 and right mouse click and click copy location
21. use program called Notepad and paste and you will see the entire path..

[stevesh]

And in Web Developer:

#4 - Hit Ctrl-Shift-Y
#5 - same
#6 - same

The path to the correct stylesheet and the rule(s) relevant to that element will appear in the pane that opens.

[sofasurfer]

I have not even tried web developer yet. One problem at a time I do intend to look at it someday though.

Haredo, I did look at youtube. I just did not see what I was supposed to see.
I did follow your intruction though, and I understand. Thanks

I know you guys probably get sick of answering the same stuff over and over but a lot of it just does not make sense until you master the language and terminology a bit.

So, anyway, while I have you here...
In the same place, while I see that I can change colors and fonts and even align stuff to the right or left by editing the right hand pane, I see that I change the actual text by editing the left hand pane. Correct?

Can this window tell me where to actually change the text (the words) or is that another tool?

[haredo]

You are most welcome...

This tutorial will answer the text question..

https://www.zen-cart.com/tutorials/index.php?article=39