From the course: CSS Essential Training

Unlock this course with a free trial

Join today to access over 25,600 courses taught by industry experts.

Working with developer tools

Working with developer tools

From the course: CSS Essential Training

Start my 1-month free trial Buy for my team

Working with developer tools

“

- HTML elements such as headings and paragraphs have default margin and padding styles. You can also add spacing to any element with the padding and margin properties, so when you're using multiple elements in the same area, it can be hard to tell which element the spacing is coming from. To identify the source, we can use browser developer tools to inspect the elements. For this exercise, we'll use the box-model.html file located in the Chapter 4 04_06 folder. Since we don't need to make any edits, let's open the file from Finder or Explorer instead of the editor. This way, we won't have to relaunch the Live Server plugin when we go back to updating our project files. I'll be using Firefox and Chrome for this demo, but the developer tools in other browsers will have similar functionality. If you double-click the file, it will open in your default browser. For me, it's Firefox. To open it in another browser,…

Contents