In this chapter we are going to look at how to control where each element sits on a page and how to create attractive page layouts.
This involves learning about how designing for a screen can be different to designing for other mediums (such as print). In this chapter we will:
CSS treats each HTML element as if it is in its own box. This box will either be a block-level box or an inline box.
Block-level boxes start on a new line and act as the main building blocks of any layout, while inline boxes flow between surrounding text. You can control how much space each box takes up by setting the width of the boxes (and sometimes the height, too). To separate boxes, you can use borders, margins, padding, and background colors.