Our Blog

Ongoing observations by End Point people

Firebug in Action: CSS Changes

By Steph Skardal · March 19, 2012

Tags: css, tips, tools

When I work with clients, I encourage them to use tools to improve efficiency for web development. Sometimes my clients want styling (CSS) adjustments like font-size, padding, or orientation changes, but they aren't sure what they want before they've seen it applied to real content. I recommend embracing a tool such as Firebug for examining temporary on-page CSS edits. Here's a quick video that demonstrates Firebug in action as I try out a few adjustments to End Point's home page.

Some of the changes I test out in the video include:

  • Font-color changes
  • Deleting DOM elements
  • Padding, margin adjustments
  • Background color changes

Firebug offers a lot more functionality but the video covers interactive CSS changes only. Read more about Firebug's features here. Chrome has similar functionality with the Developer Tools included in the core software. There are similar tools in the other browsers, but I develop in Chrome or Firefox and I'm not familiar with them.

Comments

Archive