From the course: CSS: Float-Based Page Layouts (2012)
Unlock the full course today
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Using the Firebug Inspector and the WebKit Web Inspector - CSS Tutorial
From the course: CSS: Float-Based Page Layouts (2012)
Using the Firebug Inspector and the WebKit Web Inspector
Now that we've seen how to access a browser's web debugging tools, let's experiment with using them to troubleshoot our CSS and refine our page layout. Now, for this exercise, we're going to focus on using the two most popular web debugging tools, Web Inspector and Firebug, as a way of getting more comfortable with using the tools, but don't be afraid to use Dragonfly or Microsoft's tools, whichever browser that you're going to be using most frequently, and really should be comfortable with using all of these tools. Okay, so I have index.htm opened up here from the 01_11 folder, and the first thing I'm going to do is I'm just going to preview this in Firefox. So, this is very common. We work on a page for a while, we save it, we test it, we preview it in the browser, and we see something that doesn't exactly look the way that it's supposed to. And in a lot of cases, we have to sort of guess why or go back in our code and figure something out. In this case, I want to use is browser…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
(Locked)
Box model review8m 47s
-
(Locked)
Calculating element dimensions11m 11s
-
Understanding margin collapse7m 59s
-
(Locked)
Calculating em values7m 41s
-
(Locked)
Calculating percentage values7m 51s
-
(Locked)
Normal document flow13m 3s
-
(Locked)
Controlling element display8m 53s
-
(Locked)
Using CSS Resets7m 11s
-
(Locked)
Fixed, fluid, and responsive layouts9m 9s
-
(Locked)
CSS debugging tools6m 46s
-
(Locked)
Using the Firebug Inspector and the WebKit Web Inspector11m 5s
-
(Locked)
-
-
-
-
-
-
-
-