Setting up the Body

Starting with the body of a web page is usually a good idea because the changes will govern how some properties across the entire page will look, saving you time in the process.

Firstly, always make sure you start every project on the base breakpoint. This is the default view and screen size that you will be targeting. The most common base breakpoint size is 1440px, so I will assume for this project that you are on it as well.

To ensure you're on the base breakpoint, click the icon on the top of your page that shows a laptop with a star on it, as shown in Figure 4.1. And if the dimension is not set to 1440px, manually change it now:

Figure 4.1 – The base breakpoint of 1440px

Any changes you make to the page on the base breakpoint will cascade down to all device sizes smaller than it. Later in this chapter, we will then change breakpoints sizes to ensure that the page looks great on other device sizes too.

Now, let&apos...