positioning

Positiong makes it possible to create layouts that are user-friendly. It allows developers to play arround with different ways of presenting content.

Float

Float property is used for positioning content, that specifies how an element should float. For example, it allows an image float left to the text in a container. It can have one of the following values:

leftThe element floats to the left of its container.

rightThe element floats to the right of its container.

noneThe element does not float (will be displayed just where it occurs in the text). This is the default value.

inheritThe element inherits the float value of its parent.

Flexbox

The main idea behind the flex layout is to give the container the ability to alter its items’ width/height (and order) to best fill the available space (mostly to accommodate to all kind of display devices and screen sizes). A flex container expands items to fill available free space or shrinks them to prevent overflow. Flexbox layout is most appropriate to the components of an application, and small-scale layouts.

Grid

Grid is a two-dimensional grid-based layout system. The Grid layout is intended for larger scale layouts.