From the course: Dreamweaver CS6 Essential Training
Unlock the full course today
Join today to access over 22,700 courses taught by industry experts or purchase this course individually.
Using CSS Inspect - Dreamweaver Tutorial
From the course: Dreamweaver CS6 Essential Training
Using CSS Inspect
Live view is amazing at helping you understand how your layout will look in most browsers. But trying to troubleshoot your CSS can be frustrating. As the CSS visual aids that we covered in the last movie are disabled when you are in Live view. Well, that's where CSS Inspect comes in. CSS Inspect let's you do just that; inspect the elements on the page and visually explore the box model properties that have been set on the elements. As you'll see, it's an invaluable way to troubleshoot layout issues. So I have the spotlight.htm file open and that can be found in the 06_10 folder. And I have Live view turned on. Now if I just scroll around my page you know everything looks for the most part okay, but I notice a couple of things right off the bat that are troubling. I have too much space between the headline and the student's name. And everywhere between the elements I have this sort of three pixel spacing that creates the look and feel borders around them, but towards the bottom here, I…
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)
Setting CSS preferences9m 32s
-
An overview of the CSS Styles panel9m 23s
-
(Locked)
Creating a new CSS rule6m 42s
-
(Locked)
Using the CSS Rule Definition dialog7m 25s
-
(Locked)
Organizing styles7m 22s
-
(Locked)
Modifying style properties6m 17s
-
(Locked)
Controlling CSS through the Property inspector6m 37s
-
Attaching external style sheets5m 54s
-
(Locked)
Using CSS visual aids7m 3s
-
(Locked)
Using CSS Inspect6m 48s
-
(Locked)
Using the Code Navigator6m 39s
-
(Locked)
-
-
-
-
-
-