From the course: CSS Essential Training

Intro to CSS Layout - CSS Tutorial

From the course: CSS Essential Training

Start my 1-month free trial Buy for my team

Intro to CSS Layout

“

- CSS page layout techniques are used to change the position of elements on a webpage in relation to factors such as the default position within the normal page flow, other elements around them, and the browser viewport window. The normal flow is the default page layout, which is how it looks when you don't make any changes. This works for simple layouts, such as a blog, where content basically just flows from top to bottom. But for more complex layouts that require a sidebar or multiple columns and rows, we'll need to use CSS layout techniques to change the flow. CSS grid, flexbox, floats and position are methods used to change how elements are laid out in the CSS. Each tool has its own specific uses and benefits, and it's not uncommon to use a combination of layout methods in the same project. Knowing what each tool is designed for will help us choose the best one for the task at hand. In this chapter, we'll focus on layouts with the float and position properties.

Contents