Edit your CSS with Firefox

You can use Mozilla Firefox, one of its downloaded extensions, and the fully commented stylesheet to edit the CSS of an ANGEL course. The benefit of this editing setup is you can see your changes as you make them.
Step 1: Get the Fully Commented Stylesheet

You will need to get the Fully Commented Stylesheet to use as a reference, please see the previous page to obtain it. You may find it handy to print out the printer friendly version to have as a reference

Step 2: Download and install the Mozilla Firefox browser

Visit this site: http://www.mozilla.com/firefox/ and download the Firefox Browser.

Step 3: Install the EditCSS extension for Firefox

In your newly installed Firefox browser click "Tools" in the menus at the top of the browser window.
Now in the Tools menu click "Extensions".
In the Extensions area, click the link for "Get More Extensions" in the bottom of the window.
This is a list of Extensions for Firefox, find the "EditCSS" extension, and click it.
In the description for this Extension will be a link to "Install Now ", click this link.
The Extension will download and you can install it. You will then be asked to restart your browser.

Step 4: Bringing these tools together Now that you have the tools you need, here's the process.

Open Firefox and proceed to your ANGEL course.
ANGEL is still a frames-based site, so in order for EditCSS to work, you will need to separate the top frame (containing your tabs) from the left and bottom.
Right-click on the area that has your course tabs and select "This Frame" and then "Show Only This Frame"
You have now separated the top frame from the bottom. You should now see only the tabs of your course, and the course title.
To enter EditCSS, press Shift+Ctrl+8 on your keyboard. This will bring up an area on the left side of your browser where you can edit the CSS for ANGEL. As you make changes to this area it doesn't make live changes to ANGEL, you will still have to upload your edited CSS to your ANGEL course to make the changes live. EditCSS only allows you to preview your changes, save, and load them.