How can I edit CSS code with Firebug?

Andy May 12, 2010
Pinterest Stumbleupon Whatsapp

On filmter.com, I want to give margin to “tell a friend” button on the homepage. I use Firebug to see in which CSS file the attributes of the button are located in. However, Firebug doesn’t write the name of the CSS file even though it shows the element’s attributes. Can anyone tell me how I can find the mentioned CSS file?

Ads by Google

  1. Anonymous
    May 29, 2010 at 7:52 pm

    Clarification: Firebug is an add-in originally for the Firefox web browser.

    Firebug does let you change CSS attributes but only within your current session and browser tab. To get the name of the CSS file select an element and you should get 2 frames at the bottom of the screen, left shows HTML, right shows CSS and the css file name is shown too. However if you do much of this kind of stuff go get the web developer toolbar here http://chrispederick.com/work/web-developer/ You'll be impressed and hopefully make a donation to Chris for this fantastic free tool.

    I'm assuming you are involved with filmter.com so can change the CSS on that site, if not you could experiment with one of the web developer CSS options "add user stylesheet".

  2. Steve Campbell
    May 13, 2010 at 7:07 pm

    Andy,

    I thought you could edit CSS right within Firebug by clicking within the code but I could be mistaken. Firebug is a good way to view which lines of code affect which elements, but to find the file itself you are going to have to FTP your server or search through the files in your control panel. Most likely, your file will have CSS in the title or extension, so it shouldn't be too hard to locate.

    Once you locate the CSS file, simply edit the code manually and re-upload the new file to the folder, overwriting the previous one.